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时，你只是“看”这个函数，你可以检查它是否被调用，你可以模拟它的返回值，你可以检查一个调用它的参数，也就是说，你可以检查很多关于函数调用历史的东西，但你仍然需要明确地调用函数（或者控制器中从函数调用spied函数的函数）。

因此，您正在监视服务，并且您正在测试Controller，您的测试应该类似于：

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();
});

如何测试。然后（使用茉莉花在单元测试AgularJS中的功能

1 个答案: