$scope.$apply undefined angularJS unit testing jasmine

Question

I'm testing a controller containing

$document.on('click', $scope.$apply.bind($scope, $scope.deactivate));

When I test this controller using Jasmine & Karma

'use strict';

describe('controllers: ArrayCtrl', function() {
    var scope;

    beforeEach(module('ironridge'));

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

    it('test section ', inject(function($controller) {
        expect(scope.pannels.length).toBe(0);
    }));

});

I get the following error :

PhantomJS 1.9.8 (Linux 0.0.0) controllers: ArrayCtrl should be located in Quote Section FAILED TypeError: 'undefined' is not a function (evaluating '$scope.$apply.bind($scope, $scope.deactivate)') undefined at /home/hpro/ironridge/src/app/components/array/array.controller.js:183 at invoke (/home/hpro/ironridge/bower_components/angular/angular.js:4219) at instantiate (/home/hpro/ironridge/bower_components/angular/angular.js:4227) at /home/hpro/ironridge/bower_components/angular/angular.js:8533 at /home/hpro/ironridge/bower_components/angular-mocks/angular-mocks.js:1878 at /home/hpro/ironridge/src/app/components/array/array.controller.spec.js:11 at invoke (/home/hpro/ironridge/bower_components/angular/angular.js:4219) at workFn (/home/hpro/ironridge/bower_components/angular-mocks/angular-mocks.js:2437) TypeError: 'undefined' is not an object (evaluating 'scope.pannels.length') undefined at /home/hpro/ironridge/src/app/components/array/array.controller.spec.js:17 at invoke (/home/hpro/ironridge/bower_components/angular/angular.js:4219) at workFn (/home/hpro/ironridge/bower_components/angular-mocks/angular-mocks.js:2437)

help please

himaja himaja · Accepted Answer · 2015-07-22T16:14:49

$document.on('click', $scope.$apply.bind($scope, $scope.deactivate));

I don't think the above code works. I guess you are trying to apply the scope. You can do

    $(document).on('click', function(){
        if(!$scope.$$phase){
            $scope.$apply();
        }
        $scope.deactivate();
   });

Coming to the test case, bind function in AngularJs is used as

angular.bind(self, fn, args)

according to the documentation. In JQuery, bind is used to attach a handler to an event for the elements. In any case $scope.$apply.bind will not work. That is the reason your test case is throwing the error.

$scope.$apply undefined angularJS unit testing jasmine

1 Answers