angularjs – 角度模拟无法注入我的模块依赖关系

发布时间：2020-12-17 09:29:28 所属栏目：安全来源：网络整理

导读：我想为我的应用程序fooApp测试一个角度控制器,定义如下： var fooApp = angular.module('fooApp',[ 'ngRoute','ngAnimate','hmTouchEvents' ]);... 控制器MainCtrl被定义： "use strict";fooApp.controller('MainCtrl',function ($scope,$rootScope,fooServi

我想为我的应用程序fooApp测试一个角度控制器,定义如下：

var fooApp = angular.module('fooApp',[ 'ngRoute','ngAnimate','hmTouchEvents' ]);
...

控制器MainCtrl被定义：

"use strict";

fooApp.controller('MainCtrl',function ($scope,$rootScope,fooService) {
    ...
}

所以我已经测试了几种方法来创建一个测试,像这样：

'use strict';

describe('MainController test',function () {

    var scope;
    var controller;

    beforeEach(function () {
            angular.mock.module('ngRoute',[]);
            angular.mock.module('ngAnimate',[]);
            angular.mock.module('hmTouchEvents',[]);
            angular.module('cwfApp','hmTouchEvents' ]);

            angular.mock.inject(function ($rootScope,$controller) {
                scope = $rootScope.$new();
                controller = $controller('MainCtrl',{
                    $scope: scope
                });
            });
        });

        it('should display a list',function () {
            console.log('-------------- Run Test 1 | ' + scope);
            expect(scope.currentStep).toBe(1);
        });

});

结果：

Error: [$injector:modulerr] http://errors.angularjs.org/1.2.16-build.64+sha.245de33/$injector/modulerr?p0=undefined&p1=Error%3A%20%5Bng%3Aareq%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.2.16-build.64%2Bsha.245de33%2Fng%2Fareq%3Fp0%3Dfn%26p1%3Dnot%2520a%2520function%252C%2520got%2520undefined%0A%20%20%20%20at%20Error%20(%3Canonymous%3E)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A6%3A471%0A%20%20%20%20at%20wb%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A18%3A360)%0A%20%20%20%20at%20Qa%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A18%3A447)%0A%20%20%20%20at%20nc%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A31%3A191)%0A%20%20%20%20at%20Object.d%20%5Bas%20invoke%5D%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A33%3A176)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A32%3A254%0A%20%20%20%20at%20Array.forEach%20(native)%0A%20%20%20%20at%20r%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A7%3A298)%0A%20%20%20%20at%20e%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A32%3A9)
        at Error (<anonymous>)
        at d:/dev/foo/app/bower_components/angular/angular.min.js:6:471
        at d:/dev/foo/app/bower_components/angular/angular.min.js:32:400
        at Array.forEach (native)
        at r (d:/dev/foo/app/bower_components/angular/angular.min.js:7:298)
        at e (d:/dev/foo/app/bower_components/angular/angular.min.js:32:9)
        at Object.$b [as injector] (d:/dev/foo/app/bower_components/angular/angular.min.js:35:98)
        at workFn (d:/dev/foo/app/bower_components/angular-mocks/angular-mocks.js:2142:52)
        at Object.window.inject.angular.mock.inject [as inject] (d:/dev/foo/app/bower_components/angular-mocks/angular-mocks.js:2133:37)
        at null.<anonymous> (d:/dev/foo/test/jasmine/todo.test.js:15:22)
    TypeError: Cannot read property 'currentStep' of undefined
        at null.<anonymous> (d:/dev/foo/test/jasmine/todo.test.js:25:21)
Chrome 31.0.1650 (Windows 7): Executed 1 of 1 (1 FAILED) ERROR (0.023 secs / 0.015 secs)

我也测试过beforeEach(angular.mock.module(‘cwfApp’)); (而不是之前的代码中的第一个beforeEach),但错误几乎相同.

关于我的karma.conf.js文件,我设置这个文件列表：

files: [
        'app/bower_components/angular/angular.min.js','app/bower_components/angular-route/angular-route.min.js','app/bower_components/hammerjs/hammer.min.js','app/bower_components/angular-hammer/angular-hammer.js','app/bower_components/angular-mocks/angular-mocks.js','app/js/foo-application.js','app/js/foo-controllers.js','app/js/foo-services.js','app/js/foo-router.js','test/jasmine/*.js'
    ],

注入似乎失败了,但我真的不明白我的配置中丢失或错误.上面的stacktrace没有给出很多解释…

任何想法？

我使用角度1.2.8.

问候

编辑,由@Engineer提供的代码：

beforeEach(angular.mock.module('fooApp'));

beforeEach(angular.mock.inject(function($rootScope,$controller) {
    scope = $rootScope.$new();
    controller = $controller('MainCtrl',{
        $scope: scope
    });
}));

it('should display a list',function () {
    console.log('-------------- Run Test 1 | ' + scope);
    expect(scope.currentStep).toBe(1);
});

错误几乎相同：

Error: [$injector:modulerr] http://errors.angularjs.org/1.2.16-build.64+sha.245de33/$injector/modulerr?p0=cwfApp&p1=Error%3A%20%5B%24injector%3Amodulerr%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.2.16-build.64%2Bsha.245de33%2F%24injector%2Fmodulerr%3Fp0%3DngAnimate%26p1%3DError%253A%2520%255B%2524injector%253Anomod%255D%2520http%253A%252F%252Ferrors.angularjs.org%252F1.2.16-build.64%252Bsha.245de33%252F%2524injector%252Fnomod%253Fp0%253DngAnimate%250A%2520%2520%2520%2520at%2520Error%2520(%253Canonymous%253E)%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fbase%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F5961971009303638e9ad386869316e8c83f67e56%253A6%253A471%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fbase%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F5961971009303638e9ad386869316e8c83f67e56%253A20%253A260%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fbase%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F5961971009303638e9ad386869316e8c83f67e56%253A21%253A262%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fbase%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F5961971009303638e9ad386869316e8c83f67e56%253A32%253A69%250A%2520%2520%2520%2520at%2520Array.forEach%2520(native)%250A%2520%2520%2520%2520at%2520r%2520(http%253A%252F%252Flocalhost%253A9876%252Fbase%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F5961971009303638e9ad386869316e8c83f67e56%253A7%253A298)%250A%2520%2520%2520%2520at%2520e%2520(http%253A%252F%252Flocalhost%253A9876%252Fbase%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F5961971009303638e9ad386869316e8c83f67e56%253A32%253A9)%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fbase%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F5961971009303638e9ad386869316e8c83f67e56%253A32%253A86%250A%2520%2520%2520%2520at%2520Array.forEach%2520(native)%0A%20%20%20%20at%20Error%20(%3Canonymous%3E)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A6%3A471%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A32%3A400%0A%20%20%20%20at%20Array.forEach%20(native)%0A%20%20%20%20at%20r%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A7%3A298)%0A%20%20%20%20at%20e%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A32%3A9)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A32%3A86%0A%20%20%20%20at%20Array.forEach%20(native)%0A%20%20%20%20at%20r%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A7%3A298)%0A%20%20%20%20at%20e%20(http%3A%2F%2Flocalhost%3A9876%2Fbase%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F5961971009303638e9ad386869316e8c83f67e56%3A32%3A9)
        at Error (<anonymous>)
        at d:/dev/foo/app/bower_components/angular/angular.min.js:6:471
        at d:/dev/foo/app/bower_components/angular/angular.min.js:32:400
        at Array.forEach (native)
        at r (d:/dev/foo/app/bower_components/angular/angular.min.js:7:298)
        at e (d:/dev/foo/app/bower_components/angular/angular.min.js:32:9)
        at Object.$b [as injector] (d:/dev/foo/app/bower_components/angular/angular.min.js:35:98)
        at workFn (d:/dev/foo/app/bower_components/angular-mocks/angular-mocks.js:2142:52)
    TypeError: Cannot read property 'currentStep' of undefined
        at null.<anonymous> (d:/dev/foo/test/jasmine/todo.test.js:20:21)

我会尝试创建一个小提琴来重现我的问题

事实上我的问题是由于karma.conf.js中的一些错误.的确,我的申请被定义如下：

var fooApp = angular.module('fooApp','hmTouchEvents' ]);

我的karma.conf.js加载了以下脚本：

files: [
    'app/bower_components/angular/angular.min.js','test/jasmine/*.js'
],...

但是没有加载模块ngAnimate.所以我刚刚添加了这一行：

'app/bower_components/angular-animate/angular-animate.min.js',

它的工作原理

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!