browserify/karma/angular.js "TypeError: Cannot read property '$injector' of null" when second test uses "angular.mock.inject", "currentSpec" is null

browserify/karma/angular.js "TypeError: Cannot read property '$injector' of null" when second test uses "angular.mock.inject", "currentSpec" is null

我有一个 Angular.js 应用程序,正在尝试将其与 Browserify 一起使用。该应用程序有效,但我也想 运行 测试,我有两个茉莉花测试,我 运行 有业力。我使用 browserify 允许我访问 angular.js 和 angular-mocks.js 以及测试中的其他测试装置。

版本是:-

"angular": "^1.4.0",
"angular-mocks": "^1.4.0",
"browserify": "^10.2.3",
"karma": "^0.12.32",
"karma-browserify": "^4.2.1",
"karma-chrome-launcher": "^0.1.12",
"karma-coffee-preprocessor": "^0.2.1",
"karma-jasmine": "^0.3.5",
"karma-phantomjs-launcher": "^0.1.4",

如果我 运行 单独测试(通过评论 karma.conf 文件中的一个或另一个),它们都可以正常工作。 (是的!)

但是如果我 运行 他们两个我都会得到这个错误

    TypeError: Cannot read property '$injector' of null
    at Object.workFn (/tmp/3efdb16f2047e981872d82fd8db9c0a8.browserify:2272:22 <- node_modules/angular-mocks/angular-mocks.js:2271:0)

查看 angular 的第 2271 行。mocks.js 它显示为

if (currentSpec.$injector) {

很明显 currentSpec 现在不知何故为空。

我已将问题隔离到第二次测试中调用 "angular.mock.inject" 时。

beforeEach(angular.mock.inject(function (_GridUtilService_) {
  gridUtilService = _GridUtilService_;
}));

如果我将其注释掉它会起作用,但显然我不能 运行 在我的 gridUtilService 中进行测试。

有谁知道如何运行两个(或更多:-)angular-mock jasmine test with karma and browserify?

下面是我的测试,karma.conf 文件。 Angular 服务在部署时可以正常工作,但出于此目的,它们可以简单地成为无所事事的愚蠢服务。

karma.conf:-

// Karma configuration

module.exports = function(config) {
  config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',

    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['browserify', 'jasmine'],

    // list of files / patterns to load in the browser
    files: [
      'src/main/assets/js/**/*.js',
//      'src/test/**/*.js'
      'src/test/services/SettingUtil*.js',
      'src/test/services/GridUtil*.js'
    ],


    // list of files to exclude
    exclude: [
        'src/main/assets/js/**/app-config.js'
    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
      'src/main/assets/js/**/*.js': ['browserify'],
      'src/test/**/*.js': ['browserify']
    },

    browserify: {
        debug: true,
        extensions: ['.js', '.coffee', '.hbs']
    },

    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],

    // web server port
    port: 9876,

    // enable / disable colors in the output (reporters and logs)
    colors: true,

    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_DEBUG,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,

    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
//    browsers: ['PhantomJS', 'Chrome'],
//    browsers: ['PhantomJS'],
    browsers: ['Chrome'],

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false
  });
};

src/test/services/SettingUtilServiceTest.js:

'use strict';

describe("SettingUtilServiceTest.", function() {
  it("contains spec with an expectation", function() {
    expect(true).toBe(true);
  });

  require('angular');

  require('angular-mocks'); 

  // can't do below see error at https://github.com/xdissent/karma-browserify/issues/10
  //beforeEach(module('dpServices'));

  //so need todo this
  beforeEach(angular.mock.module('dpServices'));

  var fixtures = require('./serviceFixtures.js');

  var sus = fixtures.settingUtilServiceTestFixtures;
  var ts1 = sus.tablesetting1;
  var ts2 = sus.tablesetting2;

  var settingUtilService;

  beforeEach(angular.mock.inject(function (_settingUtilService_) {
      settingUtilService = _settingUtilService_;
    }));

    it('should return an object containing mins and maxs from function minMaxes()', function() {
        expect(ts1).toBeDefined();
        expect(ts2).toBeDefined();
        var minMaxs = settingUtilService.minMaxs(ts1);
        var mins = minMaxs.mins;
        expect(mins).toBeDefined();
        var maxs = minMaxs.maxs;
        expect(maxs).toBeDefined();
    });

});

src/test/services/GridUtilServiceTest.js:

'use strict';

describe("GridUtilServiceTest.", function() {
  it("is a set of tests to test GridUtilService.", function() {
    expect(true).toBe(true);
  });

  require('angular');

  require('angular-mocks');

  // can't do below see error at https://github.com/xdissent/karma-browserify/issues/10
//  beforeEach(module('dpServices'));

  //so need todo this
  beforeEach(angular.mock.module('dpServices'));

  var fixtures = require('./gridFixtures.js');

  var gridFix = fixtures.gridUtilServiceTestFixtures;

  var ts1 = gridFix.tablesetting1;
  var ts2 = gridFix.tablesetting2;
  var ts3 = gridFix.tablesetting3;

  var gridUtilService;

  beforeEach(angular.mock.inject(function (_GridUtilService_) {
    gridUtilService = _GridUtilService_;
  }));

  it('should return an object containing mins and maxs from function minMaxes()', function() {
        expect(ts1).toBeDefined();
        expect(ts2).toBeDefined();
        expect(ts3).toBeDefined();
    });

});

如果您需要访问 angular 设置,我可以提供它(使用 browserify 的 require() 函数拆分为多个文件并使用 gulp 构建...但是正如我所说的应用程序 运行没问题,只有在有两个测试时测试才会失败,所以我认为问题出在 karma-jasmine 和 angular-mocks 或覆盖 currentSpec 变量。

如果有人知道如何在没有错误消息的情况下将我的 angular 测试拆分为多个测试(我不想要单一的 angular 测试),我们将不胜感激。谢谢。

我遇到了同样的问题,我的问题是因为我要求 angular 和 angular-mocks 与每个描述块中的完全一样。我移动了两条线

require('angular');
require('angular-mocks');

在描述块之上,并确保只调用它们一次。