CODEWITHSUNDEEP
unit-testingangularjsjasmine
FreshRob
FreshRob

Reputation: 363

Faking a Angular Factory in a directive in jasmine

Question: How do I fake my pointFactory so I can Jasmine Unit Test it.

I have the Following Directive. It takes the html sends it to a factory and the uses the response for some logic

CommonDirectives.directive('TextEnrichment',['PointFactory','appSettings', function (pointFactory,settings) {
    return {
        restrict: 'A',
        link : function (scope, element, attrs) {
         var text = element.html();
         pointFactory.getPoints(text).then(function(response){

 })}}}]);

So far my unit tests looks like this, however it doesn't work since I'm not injecting the factory.

beforeEach(module('app.common.directives'));

beforeEach(function () {
    fakeFactory = {
        getPoints: function () {
            deferred = q.defer();
            deferred.resolve({data:
                [{"Text":"Some text"}]
            });
            return deferred.promise;
        }
    };
getPointsSpy = spyOn(fakeFactory, 'getPoints')
        getPointsSpy.andCallThrough();

 });

beforeEach(inject(function(_$compile_, _$rootScope_,_$controller_){
        $compile = _$compile_;
        $rootScope = _$rootScope_;
    }));

it('Factory to have been Called', function () {
    var element = $compile('<div data-text-enrichment=""> Text </div>')($rootScope)
    expect(getPointsSpy.callCount).toBe('1');
});

Update

Following advice from Felipe Skinner I have updated the test with the following

  beforeEach(function(){
       module(function($provide){
           $provide.factory('PointFactory',getPointsSpy)
       })
});

However I get the following error:

TypeError: 'undefined' is not a function (evaluating 'pointFactory.getPoints(text)')

Upvotes: 1

Views: 3434

Answers (1)

Felipe Skinner
Felipe Skinner

Reputation: 16636

You can use the $provide to inject your controller dependencies. Here's my beforeEach for example:

describe('MyCtrl', function() {
    var $controller,
        $scope,
        $httpBackend,
        windowMock,
        registerHtmlServiceMock,
        mixPanelServiceMock,
        toastMock;

    beforeEach(function() {
        windowMock =  { navigator: {} };
        registerHtmlServiceMock = {};
        mixPanelServiceMock = jasmine.createSpyObj('mixpanel', ['track']);
        toastMock = jasmine.createSpyObj('toast', ['error']);

        module('myModule');
        module(function($provide) {
            $provide.value('$window', windowMock);
            $provide.value('RegisterHtmlService', registerHtmlServiceMock);
            $provide.value('MixPanelService', mixPanelServiceMock);
            $provide.value('ToastService', toastMock);
        });

        inject(function(_$controller_, _$rootScope_, _$httpBackend_) {
            $scope = _$rootScope_.$new();
            $controller = _$controller_('CourseSelectionCtrl', { $scope: $scope });
            $httpBackend = _$httpBackend_;
        });
    });

    // my test cases

});

I haven't tried mocking a function that returns some value. Those two mocks (mixpanel-track and toast-error) are for "void" functions.

UPDATE:

Try changing the previous $provide with this type of injection then.

Change from this: 

module(function($provide) {
    $provide.value('$window', windowMock);
    $provide.value('RegisterHtmlService', registerHtmlServiceMock);
    $provide.value('MixPanelService', mixPanelServiceMock);
});

inject(function(_$controller_, _$rootScope_, _$httpBackend_) {
    $scope = _$rootScope_.$new();
    $controller = _$controller_('CourseSelectionCtrl', { $scope: $scope });
    $httpBackend = _$httpBackend_;
});

To this:

    beforeEach(inject(function(_$controller_, _$rootScope_, _$httpBackend_) {
        mixPanelService = mixPanelServiceMock;
        $scope = _$rootScope_.$new();
        $controller = _$controller_('MyCtrl', { $scope: $scope, MixPanelService: mixPanelService });
        $httpBackend = _$httpBackend_;
    }));

The rest of the code should be the same, except for that. Let me know if this works

Upvotes: 1

Related Questions