如何测试。然后（功能单元测试AgularJS茉莉花

Question

我不清楚如何在单元测试中使用SpyOn ...

我有以下控制器

(function() { 
    'use strict'; 
    angular.module('otpConfigureDatasets').controller('otpActivityCardController', otpActivityCardController); 

    otpActivityCardController.$inject = ['$location', '$state', 'otpWebMapApp', 'otpWMDeltaTracker', 'otpWMStateCache', '$scope', '$timeout', 'otpActivityCardService', 'otpControlCenterData']; 

    function otpActivityCardController($location, $state, otpWebMapApp, otpWMDeltaTracker, otpWMStateCache, $scope, $timeout, otpActivityCardService, otpControlCenterData) { 
     var vm = this; 

     vm.cards = []; 

     otpActivityCardService.getActivityCards().then(function (resolve) { 
      vm.cards = resolve; 
     }); 

     //.....Some code .... 

})(); 

我需要测试在GetActivityCards（）。然后（函数...

我试图测试使用下面的代码

'use strict'; 

describe('Test controller (activityCard) in Page MyDatasets', function() { 

var MainCtrl, $state, scope, otpWebMapApp, otpWMDeltaTracker, otpWMStateCache, otpActivityCardService, otpControlCenterData; 
var card; 

beforeEach(function() { 
    module('otpConfigureDatasets'); 
}); 

beforeEach(inject(function ($controller, $rootScope, _$state_, _otpWebMapApp_, _otpWMDeltaTracker_, _otpWMStateCache_, _otpActivityCardService_, _otpControlCenterData_) { 
    scope = $rootScope.$new(); 
    scope.$parent = { $parent: { menuParentGroupClick: function menuParentGroupClick() { } } }; 
    MainCtrl = $controller('otpActivityCardController', { 
     $scope: scope 
    }); 
    otpWebMapApp = _otpWebMapApp_; 
    otpWMDeltaTracker = _otpWMDeltaTracker_; 
    otpWMStateCache = _otpWMStateCache_; 
    otpActivityCardService = _otpActivityCardService_; 
    otpControlCenterData = otpControlCenterData; 
})); 

it('Test Function', function() { 

    spyOn(otpActivityCardService, 'getActivityCards'); 

    expect(otpActivityCardService.getActivityCards).toHaveBeenCalled(); 
}); 

}); 

但我把它我得到这个错误：

Expected spy getActivityCards to have been called. 
Error: Expected spy getActivityCards to have been called. 

什么是错？

Answer 1

你为“getActivityCards”函数创建了一个间谍，但是你没有在你的测试中调用它（除非你从这个例子中隐藏了这行代码）。

当你创建一个Jasmine Spy函数时，你只是“看”这个函数，你可以检查它是否被调用，你可以模拟它的返回值，你可以检查它的调用参数也就是说，你可以检查很多关于函数调用历史的内容，但是你仍然需要明确地调用函数（或者调用控制器中调用函数的函数）。

那么，你是间谍的服务，与您正在测试控制器，您的测试应该是这个样子：

it('Test Function', function() { 

    spyOn(otpActivityCardService, 'getActivityCards'); 

    otpActivityCardService.getActivityCards(); 

    expect(otpActivityCardService.getActivityCards).toHaveBeenCalled(); 
}); 

在一个侧面说明，更可检验的，您的控制器应该封装您的服务呼叫在你的控制器的功能，如：

(function() { 
    'use strict'; 
    angular.module('otpConfigureDatasets').controller('otpActivityCardController', otpActivityCardController); 

    otpActivityCardController.$inject = ['$location', '$state', 'otpWebMapApp', 'otpWMDeltaTracker', 'otpWMStateCache', '$scope', '$timeout', 'otpActivityCardService', 'otpControlCenterData']; 

    function otpActivityCardController($location, $state, otpWebMapApp, otpWMDeltaTracker, otpWMStateCache, $scope, $timeout, otpActivityCardService, otpControlCenterData) { 
     var vm = this; 

     vm.cards = []; 

     vm.getCards = function() { 
      otpActivityCardService.getActivityCards().then(function (resolve) { 
       vm.cards = resolve; 
      }); 
     } 
     vm.getCards(); 

     //.....Some code .... 

})(); 

所以，你可以创建一个测试，真正在你的控制器测试功能（因为你描述你的测试案例的方式，它真的应该是一个服务的测试只）

it('Better test case', function() { 

    spyOn(otpActivityCardService, 'getActivityCards'); 

    MainCtrl.getCards(); 

    expect(otpActivityCardService.getActivityCards).toHaveBeenCalled(); 
});