Question

我正在尝试让我的单元测试在Grunt中工作，当我在浏览器中执行我的索引文件时，测试成功运行，但是当我使用grunt qunit运行测试时，它无法识别任何测试。

我确信这取决于我执行测试的方式，例如我只是包括：

<script>
test('Always Fail', function() {
    equal(5, 2, 'The return should be 2.');
});
</script>

在我的index.html测试页面的头部，然后运行Grunt我可以看到此测试失败。但是我正在尝试使用requireJS加载我的测试，正如我所说的那样在浏览器中工作。

我的index.html文件如下所示：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Unit Testing</title>
  <link rel="stylesheet" href="qunit/qunit.css">
  <script data-main="../unittests" src="../lib/require.js"></script>
  <script src="qunit/qunit.js"></script>
  <script>
    test('Always Fail', function() {
        equal(5, 2, 'The return should be 2.');
    });
  </script>
</head>
<body>
  <div id="qunit"></div>
  <div id="qunit-fixture"></div>
</body>
</html>

我假设是这一行：

<script data-main="../unittests" src="../lib/require.js"></script>

这导致了问题而没有加载grunt。

我的unittests.js文件如下所示：

require.config({
  paths: {
      'QUnit': 'test/qunit/qunit'
  },
  shim: {
     'QUnit': {
         exports: 'QUnit',
         init: function() {
             QUnit.config.autoload = false;
             QUnit.config.autostart = false;
         }
     } 
  }
});

// require the unit tests.
require(
  ['QUnit', 'test/dummyTest'],
  function(QUnit, dummyTest) {
      // run the tests.
      dummyTest.run();
      // start QUnit.
      QUnit.load();
      QUnit.start();
  }
);

这是我的gruntfile：

module.exports = function(grunt) {

  // use grunt 
  var nocompress, optimize;

  nocompress = grunt.option('nocompress') || false;

  if(nocompress) {
    optimize = 'none';
  } else {
    optimize = 'uglify';
  }

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    requirejs: {
      compile: {
        options: {
          appDir: "dev/",
          baseUrl: "js",
          mainConfigFile: "dev/js/bootstrap.js",
          dir: "www",
          optimize: optimize,
          modules: [
            {
              name: "app"
            }
          ]
        }
      }
    },
    qunit: {
      all: ['dev/js/test/**/*.html']
    },
    jshint: {
      options: {
        curly: true,
        eqeqeq: true,
        eqnull: true,
        browser: true,
        globals: {
          jQuery: true
        },
      },
      uses_defaults: [
        'dev/js/collections/*.js',
        'dev/js/models/*.js',
        'dev/js/views/*.js',
        'dev/js/*.js', ]
    }
  });

  // Load plugins
  grunt.loadNpmTasks('grunt-contrib-qunit');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-requirejs');

  // Default task(s).
  grunt.registerTask('build-and-qunit', ['default', 'qunit']);
  grunt.registerTask('default', ['jshint', 'requirejs']);

};

Answer 1

我使用类似于以下的结构取得了一些成功： https://github.com/jonnyreeves/qunit-require

禁用自动运行的QUnit。
需要所有依赖项。
运行QUnit。

使用QUnit，Grunt和RequireJS进行单元测试

1 个答案: