使用karma浏览器对AngularJS应用程序进行单元测试

Unit testing AngularJS application with karma-browserify

本文关键字：单元测试 应用程序 AngularJS karma 浏览器 使用      更新时间：2023-10-11

我正试图通过karma Browserify对AngularJS/Browserify应用程序进行单元测试。最终，当我运行我的吞咽因果报应任务时，我得到了错误Error: [$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it...

我的gullfile.js有任务

gulp.task('test', function(done) {
    new karma.Server({
        configFile: __dirname + '/karma.conf.js'
    }, done).start();
});

我的因果报应.conf.js包括

{
  // ...
  frameworks: ['browserify', 'jasmine'],
  files: [
    'node_modules/angular/angular.js',
    'node_modules/angular-mocks/angular-mocks.js',
    'spec/**/*.js'
  ],
  preprocessors: {
    'spec/**/*.js': [ 'browserify' ]
  },
  browserify: {
    debug: true
  }
  // ...
}

我在包含的main.js中定义我的模块

require('angular').module('myApp', [
  //...lots of `require`s for each dependency...
]);

我在一个看起来像的MainCtrl.js中定义了我的控制器

function MainCtrl(/*...deps...*/) {
  var ctrl = this;
  ctrl.foo = 'bar';
}
module.exports = MainCtrl;

然后将控制器注册到其他地方，如

var app = require('angular').module('myApp');
app.controller('MainCtrl', [/*...deps...*/, require('./MainCtrl')]);

最后，我的测试看起来像

(function() {
    "use strict";
    describe('MainCtrl', function() {
        var ctrl;
        beforeEach( angular.mock.module('myApp') );
        beforeEach( inject( function($controller) {
            ctrl = $controller('MainCtrl');
        }));
        it('should be defined', function() {
            expect(ctrl).toBeDefined();
        });
    });
}());

变通办法

我的解决方法是将我的main.js文件添加到karma.conf.js

files: [
  'js/main.js', // ADDED: Defines the app and `require`s angular
  'node_modules/angular-mocks/angular-mocks.js',
  'spec/**/*.js'
],
preprocessors: {
  'js/main.js': ['browserify'], // ADDED
  'spec/**/*.js': ['browserify']
}

一切正常。但我认为我不应该将我的源文件添加到karma中（至少不应该使用karma浏览）。这是建立我的项目的正确方式吗？

是的，"变通方法"是使用karma-browserify的理想方法。

preprocessors定义指定包含的文件应由哪个预处理器处理，但不包括它们：

预处理器配置对象的键用于过滤文件配置中指定的文件。

实际上包括文件的是files定义：

文件阵列确定浏览器中包含哪些文件，以及哪些文件由Karma监视和服务。

文件告诉Karma相对于基本路径应该加载哪些文件。这些是：

所有与测试相关的库我们要测试的源代码测试本身

相关文章：