Testing if a controller works in angularjs using jasmine

Question

I have some issues when I'm trying to test a method controller. So, here is my controller, named contactCtrl

'use strict';

(function () {
    angular.module('routerApp').controller('ContactController', function ($scope, contactRepository) {

        $scope.saveContact = function(selectedContact) {
            $scope.errors = [];

            contactRepository.saveContactInfo(selectedContact);

            $scope.contactSelected = false;
        };

        $scope.cancel = function() {
            $scope.contactSelected = false;
            $scope.selectedContact = null;
        };

        $scope.selectContact = function(contact) {
            $scope.contactSelected = true;
            $scope.selectedContact = contact;
        };
    });
}());

Here is my contactRepository

'use strict';

(function () {
    angular.module('routerApp').factory('contactRepository', function() {
        return {
            saveContactInfo: function (selectedContact) {
                console.log(selectedContact);
            }
        };
    });
}());

And here is my spec file named contactCtrl.spec.js

describe('Controller',function() {

    var scope,contactCtrl;

    beforeEach(module('routerApp'));
    beforeEach(inject(function ($rootScope, $controller) {
       scope = $rootScope.$new();
       contactCtrl = $controller('ContactController',{$scope:scope});
    }));

    describe('ContactController', function() {
        it('save method should have contactSelected false', function() {
            expect(contactCtrl.contactSelected).toBe(false);
        });
    });
})

I want to test if when I run the save method actually works.

Matt Herbstritt · Accepted Answer · 2015-08-04T09:16:24.210

You will have to actually call the function and then assert the value is what you expect. All of this needs to be done on your scope variable rather than controller.

describe('ContactController', function() {
    it('save method should have contactSelected false', function() {
        expect(scope.contatSelected).toBeUndefined();
        scope.saveContact('foo');
        expect(scope.contactSelected).toBe(false);
    });
});

If you want to check that your controller method calls your factory method you will need to create a spy and then check that spy has been called after you call the controller function:

describe('Controller',function() {

    var scope,contactCtrl, contactRepository;

    beforeEach(module('routerApp'));
    beforeEach(inject(function ($rootScope, $controller, _contactRepository_) {
       scope = $rootScope.$new();

       // inject your factory so we can spy on it
       contactRepository = _contactRepository_;
       contactCtrl = $controller('ContactController',{$scope:scope});

       // create spy
       spyOn(contactRepository, 'saveContactInfo');
    }));

    describe('ContactController', function() {
        it('save method should have contactSelected false', function() {
            expect(scope.contatSelected).toBeUndefined();
            scope.saveContact('foo');
            expect(scope.contactSelected).toBe(false);

            // assert that function was called
            expect(contactRepository.saveContactInfo).toHaveBeenCalled()
        });
    });
});

Testing if a controller works in angularjs using jasmine

1 Answers1