2

我有一个 Angular.js 应用程序，并且正在尝试将它与 Browserify 一起使用。该应用程序有效，但我也想运行测试，我有两个使用 karma 运行的 jasmine 测试。我使用 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.mocks.js 的第 2271 行它读取

if (currentSpec.$injector) {

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

当我在第二次测试中调用“angular.mock.inject”时，我已将问题隔离开来。

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

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

有谁知道如何使用 karma 和 browserify 运行两个（或更多:-) angular-mock jasmine 测试？

下面是我的测试，karma.conf 文件。Angular 服务在部署时可以工作，但出于这个目的，它们可以简单地成为什么都不做的愚蠢服务。

业力.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();
    });

});

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

如果有人知道如何在没有错误消息的情况下将我的角度测试拆分为多个测试（我不想要一个整体的角度测试），我们将不胜感激。谢谢。

4

1 回答 1

1

我有同样的问题，对我来说问题是因为我需要 angular 和 angular-mocks 就像你在每个描述块中一样。我移动了两条线

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

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

于 2016-01-12T07:54:31.577 回答