angularjs - Angularjs Jasmine 模拟方法调用控制器实例化

Question

我有一个像这样的简单组件：

.component('myComponent', {
    templateUrl: 'example.html',
    controller: function() {
        function serviceCall() {}

        serviceCall();
    }
});

我想要做的是监视 serviceCall 方法以返回一些预定义的 json。问题是要获得控制器，我需要做类似的事情

var myComponent = angular.element('<my-component><my-component>');
myComponent.element.controller('myComponent');

但是在创建组件之前我无法调用它，并且我无法创建组件，因为我还没有模拟方法调用。

我如何绕过这个catch-22？

标签： angularjskarma-jasmine

Answer 1

不幸的是，几乎没有办法解决它。

但是，假设您serviceCall()的函数在内部调用服务中的函数，您可以监视它。（记住 Angular 的良好实践——关注点分离原则）

假设您的代码：

.component('myComponent', {
    templateUrl: 'example.html',
    controller: function(SomeService) {
        function serviceCall() {
            SomeService.someFunction();
        }

        serviceCall();
    }
});

您可以在测试中注入服务并监视预期将被调用的函数：

var SomeService;

beforeEach(inject(function (_SomeService_) {
    SomeService = _SomeService_;
}));

it('should call someFunction', function () {
    spyOn(SomeService, 'someFunction').and.returnValue({
        then: function () { // Mimic a promise
            return ... mocked object ... ;
        }
    });

    // Instantiate the controller

    expect(SomeService.someFunction).toHaveBeenCalled();

    // Expect stuff to have happened in the controller with the returned value

});

希望这可以帮助 ：）