Jasmine angularjs - spying on a method that is called when controller is initialized

Question

I am currently using Jasmine with Karma(Testacular) and Web Storm to write unit test. I am having trouble spying on a method that gets called immediately when the controller is initialized. Is it possible to spy on a method that is called when the controller is initialized?

My controller code, the method I am attempting to spy on is getServicesNodeList().

myApp.controller('TreeViewController', function ($scope, $rootScope ,$document, DataServices) {
    $scope.treeCollection  =  DataServices.getServicesNodeList();
    $rootScope.viewportHeight = ($document.height() - 100) + 'px';
});

And here is the test spec:

describe("DataServices Controllers - ", function () {

beforeEach(angular.mock.module('myApp'));
describe("DataServicesTreeview Controller - ", function () {


    beforeEach(inject(function ($controller, $rootScope, $document, $httpBackend, DataServices) {
        scope = $rootScope.$new(),
        doc = $document,
        rootScope = $rootScope;
        dataServices = DataServices;

        $httpBackend.when('GET', '/scripts/internal/servicedata/services.json').respond(...);

        var controller = $controller('TreeViewController', {$scope: scope, $rootScope: rootScope, $document: doc, DataServices: dataServices });

        $httpBackend.flush();
    }));

    afterEach(inject(function($httpBackend){
        $httpBackend.verifyNoOutstandingExpectation();
        $httpBackend.verifyNoOutstandingRequest();
    }));

    it('should ensure DataServices.getServicesNodeList() was called', inject(function ($httpBackend, DataServices) {
        spyOn(DataServices, "getServicesNodeList").andCallThrough();

        $httpBackend.flush();
        expect(DataServices.getServicesNodeList).toHaveBeenCalled();
    }));


});
});

The test is failing saying that the method has not been called. I know that I should mock the DataServices and pass that into the test controller. But it seems like I would still have the same problem when spying on that method whether it is a mock or not. Anyone have any ideas or could point me to resources on the correct way to handle this?

Answer 1

When writing unit tests, you should isolate each piece of code. In this case, you need to isolate your service and test it separately. Create a mock of the service and pass it to your controller.

var mockDataServices = {
    getServicesNodeList: function () {
        return <insert your sample data here > ;
    }
};

beforeEach(inject(function ($controller, $rootScope, $document) {
    scope = $rootScope.$new(),
    doc = $document,
    rootScope = $rootScope;

    var controller = $controller('TreeViewController', {
        $scope: scope,
        $rootScope: rootScope,
        $document: doc,
        DataServices: mockDataServices
    });
}));

If it is your service that is making the $http request, you can remove that portion from your unit controller test. Write another unit test that tests that the service is making the correct http calls when it is initialized.