Gulp + karma + jasmine + angular + singleRun:true = angular注入失败

Question

我在运行通过 Karma 和 Gulp 进行 Jasmine 测试时遇到问题，我正在运行通过gulp 任务进行测试

return new karma.Server({
    configFile: __dirname + '\karma.conf.js',
    singleRun: true
}, done).start();

我的 angular 依赖项注入失败，我收到标准 angular unknown provider myProvider 错误。当我将 singleRun 属性更改为 false 时，大多数单元测试都通过了（尽管其中一组仍然失败）。

测试已经（并且仍然）在 Chutzpah 中运行良好。

我尝试将测试减少到准系统：

var myProvider;
beforeEach(module('MyModule'));

beforeEach(inject(function (_my_) {
    myProvider = _my_;
}));

it("exists", function () {
    expect(myProvider).not.toBeUndefined();
});

它仍然失败并出现 unknown provider myProvider 错误。同样，如果我将 singleRun 设置为 false，它们运行没问题。我试过运行ning PhantomJS 和 Chrome，它们都表现出完全相同的行为。

我正在使用 angular 1.4.7，我在 package.json 中的依赖项看起来像

  "dependencies": {
    "gulp": "^3.9.0",
    "gulp-chug": "^0.4.2",
    "gulp-install": "^0.6.0",
    "gulp-util": "^3.0.7",
    "phantomjs": "^1.9.19",
    "jasmine-core": "^2.4.1",
    "karma": "^0.13.19",
    "karma-jasmine": "^0.3.6",
    "karma-phantomjs-launcher": "^0.2.3",
    "karma-spec-reporter": "^0.0.23",
    "karma-chrome-launcher": "^0.2.2"
  }

karma.conf.js:

module.exports = function (config) {
    config.set({
        frameworks: ["jasmine"],
        reporters: ["spec"],
        browsers: ["PhantomJS"],
        files: [
            "./path/to/jquery/jquery-1.11.0.min.js",

            "./path/to/angular/angular.js",
            "./path/to/angular/angular-route.js",
            "./path/to/angular/angular-mocks.js",

            // I'm using this path order (app -> modules -> all) 
            // due to recommendations found on SO
            "./path/to/application/app.js",
            "./path/to/application/**/*Module.js",
            "./path/to/application/**/*.js",

            // For now, I'm just running the one test to simplify debugging
            "./path/to/tests/myTest.Test.js"
        ]
    });
};

有什么想法吗？

Answer 1

你的 Karma conf 看起来太简单了。您需要在 karma conf 中定义预处理器。您需要预加载 Angular Javascript 文件。您还应该预加载 HTML 个文件。如果测试 HTTP，您也可能想要预加载 angular 模拟。这应该会给你一个先机。有任何具体问题请询问。

'use strict';

module.exports = function (config) {
  config.set({
    basePath: './',
    browsers: ['PhantomJS'],
    frameworks: ['jasmine'],
    reporters: ['mocha', 'coverage'],
    singleRun: true,
    preprocessors: {
      'src/**/!(*spec)*.js': ['coverage'],
      'dest/**/*.html': ['ng-html2js']
    },
    ngHtml2JsPreprocessor: {
      stripPrefix: 'dest/',
      moduleName: 'ngHtmlFiles'
    },
    coverageReporter: {
      type: 'html',
      dir: 'coverage'
    },
    files: [
      'dest/vendor.min.js',
      'bower_components/angular-mocks/angular-mocks.js',
      'src/**/*.js',
      'dest/**/*.html'
    ]
  });
};

Answer 2

事实证明，我们的自定义 angular 提供程序具有内部依赖性，由于某种原因，singleRun: true 无法解决这些问题。

我在 karma.conf 中专门设置了这些文件的加载顺序，以便依赖项按 "correct" 顺序加载，现在我得到与运行 [=11 时相同的结果=]（与 singleRun:false 相同的少数测试仍然失败，但这是另一回事）。

这与 Chutzpah 一起工作的原因是那些引用（在每个单独的测试文件中列出）的顺序是正确的。

Gulp + karma + jasmine + angular + singleRun:true = angular注入失败

Gulp + karma + jasmine + angular + singleRun:true = angular fails to inject

javascript

angularjs

karma-runner

karma-jasmine

gulp