AngularJs单元测试失败,因为Karma无法识别控制器中

时间:2016-03-25 23:57:11

标签: javascript angularjs unit-testing karma-mocha ngmock

所以这就是事情。我一直在调查很多线程,但无法找到与我的错误相关的任何内容。我试图测试我的角度应用程序,(我想首先澄清一下我是unitTesting的新手)

根据this tutorial我已经设置了一切,基本测试工作正常。但是当我包含NgMock模块,我真正的角度应用程序并编写一个简单的测试来测试我的一个控制器上的方法时,我得到以下stackTrace。

grunt karma:dev
Running "karma:dev" (karma) task
25 03 2016 20:41:24.754:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
25 03 2016 20:41:24.763:INFO [launcher]: Starting browser Chrome
25 03 2016 20:41:24.771:INFO [launcher]: Starting browser Firefox
25 03 2016 20:41:28.747:INFO [Chrome 49.0.2623 (Windows 10 0.0.0)]: Connected on socket /#yRHoLsbEaJWHNtSDAAAA with id 47988329
Chrome 49.0.2623 (Windows 10 0.0.0) Unit tests del CRM:  Create new message Should create a text message with the correct structure FAILED
        TypeError: $scope.$on is not a function
            at new <anonymous> (C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/controllers/view-conversations.js:248:12)
            at e (C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/angular.min.js:39:156)
            at Object.instantiate (C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/angular.min.js:39:273)
            at C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/angular.min.js:80:228
            at C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/angular-mocks.js:1848:12
            at Context.<anonymous> (C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/test/frontend/leadaki-app-tests.js:44:30)
Chrome 49.0.2623 (Windows 10 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.087 secs / 0.024 secs)
Firefox 45.0.0 (Windows 10 0.0.0) Unit tests del CRM:  Create new message Should create a text message with the correct structure FAILED
        $scope.$on is not a function
        @C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/controllers/view-conversations.js:248:5
        e@C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/angular.min.js:39:154
        h/<.instantiate@C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/angular.min.js:39:273
        Xe/this.$get</<@C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/angular.min.js:80:226
        angular.mock.$ControllerDecorator</<@C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/public/dashboard/v4/js/angular-mocks.js:1848:12
        @C:/Users/Pablo/Data/software/workspace/intellij/leadaki-core/test/frontend/leadaki-app-tests.js:44:30

Chrome 49.0.2623 (Windows 10 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.087 secs / 0.024 secs)
Firefox 45.0.0 (Windows 10 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.053 secs / 0.011 secs)
Warning: Task "karma:dev" failed. Use --force to continue.

Aborted due to warnings.

好像&#34;模拟&#34; ngMock生成的范围并不接受听众或类似的东西。

有没有人在这里有一些错误?

我可以粘贴我的所有配置文件,但我认为这些信息过多而且我不想充斥帖子。如果需要任何其他信息,请告诉我,我会添加它。

先谢谢!

describe('Unit tests del CRM: ', function () {

    before(function() {
        if (window.__html__) {
            document.body.innerHTML = window.__html__['test/index.html'];
        }
    });

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

    var $controller;
    var $rootScope;

    beforeEach(angular.mock.inject(function(_$rootScope_, _$controller_){
        $rootScope = _$rootScope_;
        $controller = _$controller_;
    }));

    describe('Create new message', function () {
        it('Should create a text message with the correct structure', function () {
            var $scope = {};
            var controller = $controller('Contacts.viewConversation', { $scope: $scope });

            var messageBody = 'Hola, me gustaria comprar un auto';
            var newTextMessage = $scope.createMessage('text/plain', '123456789', 'user', 'abcdefghijk', messageBody);

            expect(newTextMessage.body).to.equal(messageBody);
        });
    });
});

1 个答案:

答案 0 :(得分:1)

如果不查看确切的设置,很难说,但是您是否创建了一个范围对象以注入您的控制器?

很多时候,你只需使用$ rootScope对象就可以伪造它:

beforeEach(angular.mock.inject($injector => {
    $controller = $injector.get('$controller');
    rootScope = $injector.get('$rootScope');
}));

... test code ...

let controller = $controller('UserController', {$scope: rootScope});

... do stuff with controller ...

但是,您也可以使用rootScope创建新范围并将其输入。