如何在 Angular click-handler 中测试函数

Question

我目前正在对我的 Angular 控制器进行单元测试，我的代码覆盖范围中唯一落后的部分是点击处理程序中的函数，以及这些函数中的语句。

例如，function(cap)... 表示 function not covered 和 playersService.setCap... 表示 statement not covered 与以下点击处理程序相关：

vm.setCap = function(cap) {
  playersService.setCap({playerId: playerId}, {limit: cap});
};

我将如何着手测试这样的函数，以及其中的语句？我只是在寻找基本测试 (expect(function).toHaveBeenCalled)。

Answer 1

好的，为了测试这个，您需要使用您的 playersService 的模拟版本，然后您可以将其注入您的控制器。

describe("Controller: yourController", function () {
var mockResponse = {};
var mockService = {
    setCap: function(playerId, limit){
        mockResponse.playerId = playerId,
        mockResponse.limit = limit
    }
};

var mockParams = 'cap';
var $controller;
beforeEach(inject(function (_$controller_) {
    $controller = _$controller_;
}))
it("Should call the service on click", function () {
    spyOn(mockService, 'setCap').and.callThrough();
    var testedController = $controller('yourController', { playersService:mockService });
    testedController.setCap(mockParams);
    expect(mockService.toHaveBeenCalled).toHaveBeenCalled();
    expect(mockResponse.limit.limit).toBe(mockParams);
})
});

这将为您提供该功能的白盒和黑盒测试示例。

如何在 Angular click-handler 中测试函数

How to test function within Angular click-handler

javascript

jasmine

angularjs

karma-runner