AngularJS unit test error: scope is undefined

Question

I have a problem with AngularJS unit testing. The scope in the unit test is undefined. But first the source code:

The main angular module:

var app = angular.module('App', [ 
    'AppCtrl',
    'AppServices',
    'AppDirectives',    
    'ngGrid',
    'ui.bootstrap',
    'angular-growl',
    'ngAnimate'
]);

The controller module:

var appCtrl = angular.module('AppCtrl', []);

And finally the controller to test as a simplified version:

appCtrl.controller('SignalListCtrl', ['$scope',  
    function($scope) { 
        $scope.name = "World";
}]);

Now the test. Version 1:

    describe("App", function () {
        beforeEach(module("App"));

        describe("SignalListCtrl", function () {
            var scope, controller;

            beforeEach(inject(function ($rootScope, $controller) {
                scope = $rootScope.$new();
                controller = $controller("SignalListCtrl", {$scope: scope});
                //controller = $controller;
                scope.$digest();
            }));

            it("should print World", function () {
                //controller("SignalListCtrl", {$scope: scope});
                expect(scope.name).toBe("World");
            });
        });
    });

The error Message: scope is undefined.

The Version 2:

    describe("App", function () {
        beforeEach(module("App"));

        describe("SignalListCtrl", function () {
            var scope, controller;

            beforeEach(inject(function ($rootScope, $controller) {
                scope = $rootScope.$new();
                //controller = $controller("SignalListCtrl", {$scope: scope});
                controller = $controller;
                scope.$digest();
            }));

            it("should print World", function () {
                controller("SignalListCtrl", {$scope: scope});
                expect(scope.name).toBe("World");
            });
        });
    });

The error Message: controller is not a function.

I use karma, if it depends on this.

This is the karma.conf from angular-seed. These are all libs that I used. I think I don't need every lib to test, so I commented this out. If everything is uncommented, the same error occurs. edit: Every lib I use is in the karma.conf now. I get the same error messages.

module.exports = function(config){
    config.set({
    basePath : '../',

    files : [        
        'app/lib/jquery/jquery.js',
        'app/lib/jquery/jquery-ui-dialog.js',
        'app/lib/jquery/jquery-dialog.js',    
        'app/lib/angular/angular.js',
        'app/lib/angular/angular-*.js',
        'app/lib/angular/growl/*.js',          
        'app/lib/bootstrap/*.js',
        'app/lib/highcharts/highcharts.js',   
        'app/lib/highcharts/export.js',  
        'app/lib/xml2json/*.js', 
        'app/js/*.js',
        'test/lib/angular/angular-mocks.js',
        'test/unit/*.js'
    ],

    exclude : [
    ],

    autoWatch : true,

    frameworks: ['jasmine'],

    browsers : ['Firefox'],

    plugins : [
            'karma-junit-reporter',
            'karma-chrome-launcher',
            'karma-firefox-launcher',
            'karma-jasmine'
            ],

    junitReporter : {
      outputFile: 'test_out/unit.xml',
      suite: 'unit'
    }

})};

Why the scope is undefined? The scope gets the $rootScope.$new(). I hope someone can help me.

Thanks.

P.S: I asked the same question on GoogleGroups -> https://groups.google.com/forum/#!topic/angular/4oAEVLbEZT4

But obviously nobody there can help me.

Could you try to add scope.$digest() as last line in the beforeEach? — glepretre
– glepretre, Commented Feb 21, 2014 at 8:08
You're trying to load the 'App' module in your test. This App module depends on ngGrid, ui.bootstrap, etc., but the JS files defining these modules are not included in the karma files. — JB Nizet
– JB Nizet, Commented Feb 21, 2014 at 8:47
I found out the error. With logLevel LOG_DEBUG in Karma (I don't know that before), I saw the message that highcharts wasn't found. Because in karma.conf the row 'app/lib/highcharts/*.js', include alphabetically 'export.js' before 'highcharts.js'. Now it works fine. Thanks to everyone. — eddi
– eddi, Commented Feb 21, 2014 at 10:31
You should not edit the code in your question to fix it. It would be better to answer your own question to share and explain, for future developpers encountering the same problem. — glepretre
– glepretre, Commented Apr 3, 2014 at 7:31

Pranay Dutta · Accepted Answer · 2014-12-26 04:39:07Z

4

try out this

describe("App", function () {
    beforeEach(module("App"));

    describe("SignalListCtrl", function () {
        var scope ,ctrl;

        beforeEach(inject(function ($rootScope, $controller) {

              scope = $rootScope.$new();
            ctrl= $controller("SignalListCtrl", {$scope: scope});

        }));

        it("should print World", function () {

            expect(ctrl.name).toBe("World");
        });
    });
});

answered Dec 26, 2014 at 4:39

Pranay Dutta

2,5992 gold badges33 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS unit test error: scope is undefined

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related