Angular 单元测试 NgOnInit

Question

如果你能帮助我理解一些事情，我将非常感激。 我有一个组件，它显示一些数据。在 ngOnInit() 中调用 http-service 方法从服务器获取数据。这是代码：

// isLogged - is get property
ngOnInit() {
  if (this.isLogged) {
    this.loadData();
 };
}

// Can't call in ngOnInit because this method is being used in other functions
loadData() {
  this.http.getData()
           .subscribe((result) => this.dataToDisplay = result);
}

get isLogged() {
    // this function checks for token in localStorage via custom token service. 
}

我为 loadData() 编写测试

it('should load data', async(() => {
   component.loadData();
   fixture.whenStable().then( () => {
       fixture.detectChanges();
       expect(component.dataToDisplay).toEqual(mockData);
   });
});

它按预期工作。但我的问题是：我应该如何测试 ngOnInit？这个方法所做的只是调用 loadData。但是如何检查 get 属性是否返回 true 方法正在调用？我很困惑（（

Answer 1

在这种情况下，您使用 jasmine 的 spyOn 方法模拟 this.loadData() 函数。作为断言，您期望 this.loadData() 方法已被调用（或基于 this.isLogged 的值未被调用）。

要期待 jasmine 为间谍提供的函数调用 toHaveBeenCalled() 函数。一些例子可以是found here。我假设this.isLogged 可以直接在fixture.componentInstance 上的测试中设置，因此可以将其设置为特定测试用例的期望值。

this.loadDate() 的逻辑是单独测试的，所以不需要从ngOnInit() 测试。