AngularJS 测试中的业力错误答案

【问题标题】：Karma Error on AngularJS TestAngularJS 测试中的业力错误
【发布时间】：2017-01-24 01:25:10
【问题描述】：

我正在尝试了解 grunt-karma 插件和 jasmine 框架来编写第一个 karma 测试。当我运行业力测试（咕噜测试）时，我看到初始化模块的错误，范围。我究竟做错了什么？感谢您的帮助。

gruntfile.js

 karma: {
        unit: {
          configFile: 'karma.conf.js'
        }
      }

grunt.registerTask('test',['karma:unit']);

karma.conf.js

files: [
  'scripts/bower_components/angular/angular.js',
  'scripts/bower_components/angular-mocks/angular-mocks.js',
  'config/config.js',
  'scripts/app.js',
  'scripts/controllers/*.js',
  'test/unittest/personController.test.js'
],

app.js

var app = angular.module('myApp', ['services.config']);

personController.js

app.controller('personCtrl', ['$scope', function($scope) {
    $scope.firstName = "John";
    $scope.lastName = "Doe";
    $scope.fullName = function() {
        return $scope.firstName + " " + $scope.lastName;
    };
}]);

config.js (service.config)

'use strict';

angular.module('services.config', [])
  .constant('configuration', {
    getAllBooks: '@@getAllBooks'
});

personController.test.js

describe('Testing AngularJS SampleApp [app]', function (){

    //myApp will be loaded once instead of mentioning in every it() function 
    beforeEach(module('myApp'));

    describe('1.Testing SampleApp Controllers', function(){

        var scope;
        var ctrl;

        //loading controller once inside describe instead of every it() function
        beforeEach(inject(function($controller,$rootScope){
                scope = $rootScope.$new();
                ctrl = $controller('personCtrl',{$scope:scope});
            }));

        afterEach(function(){
            //clean-up code 
        });

        it('should initialize the scope', function(){
            expect(scope.firstName).toBeDefined('John');
            expect(scope.lastName).toBeDefined('Doe');
        });

    });
});

错误：

15 09 2016 17:08:37.568:INFO [Chrome 52.0.2743 (Mac OS X 10.10.5)]: Connected on socket /#Pq9aUWSZ6FSyQjeRAAAA with id 50553444
Chrome 52.0.2743 (Mac OS X 10.10.5) Testing AngularJS SampleApp [app] 1.Testing SampleApp Controllers should initialize the scope FAILED
    Error: [$injector:modulerr] Failed to instantiate module services.config due to:
    Error: [ng:areq] Argument 'fn' is not a function, got string
    http://errors.angularjs.org/1.4.8/ng/areq?p0=fn&p1=not%20a%20function%2C%20got%20string
        at scripts/bower_components/angular/angular.js:68:12

和

at Object.workFn (scripts/bower_components/angular-mocks/angular-mocks.js:3074:52)
    TypeError: Cannot read property 'firstName' of undefined
        at Object.<anonymous> (test/unittest/personController.test.js:23:16)
Chrome 52.0.2743 (Mac OS X 10.10.5): Executed 1 of 1 (1 FAILED) ERROR (0.034 secs / 0.02 secs)

问题：
1.从 grunt file.js 引用 karma.con.js 的最佳方法是什么？我读过一些博客，我们也可以覆盖 grunt 文件中的所有 karma.conf.js 属性，而不是引用该文件？
2. 访问 xxx.test.js 文件中的控制器范围的最佳方法是什么？

【问题讨论】：

services.config 模块有错误，错误明确说明了这一点。请提供 services.config 模块的源代码
@estus：感谢您的宝贵时间。我已经使用定义 service.config 的 config.js 文件编辑了问题。该代码工作正常，也没有看到任何错误。但是测试失败了。

标签： angularjs gruntjs jasmine karma-runner karma-jasmine

【解决方案1】：

我能够解决问题，感谢 estus 指出问题，我应该已经意识到了。

personController.test.js

beforeEach(module('services.config'));
beforeEach(module('myApp'));

我没有加载在myApp 中使用的services.config 模块。然后我收到 TypeError 错误：angular.element.cleanData 不是函数。我必须确保angular 和angular-mocks 的版本相同。

带走
1.在加载应用程序之前加载所有依赖模块
2.依次添加所有脚本文件的angualr、angualr-mocks和链接
3.确保安装兼容的angular和angular-mocks版本

【讨论】：