我的间谍正在被调用，但我的功能不在业力覆盖范围内

Question

我有一个 sidenav 组件，里面有一个 header 组件：

<div>
   <app-header id="header" (openSidenavEmitter)="openSidenav()"></app-header>
</div>

我的 header 组件有一个事件发射器，当用户单击汉堡图标时，它会向 parent 组件发射一个事件以打开 sidenav：

@Output() openSidenavEmitter = new EventEmitter();
openSidenav() {
   this.openSidenavEmitter.emit()
}

在我的 sidenav 组件中，当我收到此事件时，我调用函数 openSidenav() 将变量 showSidenav:

设置为真

openSidenav() {
   this.showSidenav = true;
}

我正在尝试进行涵盖功能 openSidenav() 的单元测试。我的间谍正在被调用，我的测试正在通过，但我的功能仍未包含在业力覆盖报告中。这是我的测试：

it('should open sidenav when user click in hamburg icon', () => {
   const spyOnOpenSidenav = spyOn(component, 'openSidenav')
   const header = fixture.debugElement.query(By.css('#header'));
   header.triggerEventHandler('openSidenavEmitter', {});
   fixture.detectChanges();
   expect(spyOnOpenSidenav).toHaveBeenCalled();
}

如何覆盖这个功能？

Answer 1

我建议将您的测试更新为以下内容：

it('should open sidenav when user click in hamburg icon', () => {
   const spyOnOpenSidenav = spyOn(component, 'openSidenav').and.callThrough()
   ...
}

可能发生的情况是您正在调用您的方法，该方法有一个间谍。由于间谍被放置在方法上，除非您告诉它，否则它不会真正执行。

为确保该方法继续执行，您应该使用 and.callThrough() 方法。

此外，如果您想确保您的测试完全覆盖您的功能，请检查 openSidenav 的值是否更改为 true。

这是一个非常简单的函数，但是如果你有更多的行为可以改变 openSidenav 的值，你将不会在不查看最终值的情况下知道测试是否成功。

我的间谍正在被调用，但我的功能不在业力覆盖范围内

My spy is being called but my function is not being covered in karma coverage

jasmine

angular