HostListener 的 Angular 单元测试（窗口调整大小）

Question

我有一个包含以下代码的组件文件

@HostListener('window:resize', ['$event'])
onResize(event) {
    this.width = event.target.innerWidth;
}

我想测试一下。我已尝试在我的规范文件中使用以下代码。

window.dispatchEvent(new Event("resize");
expect(component.onResize).toHaveBeenCalled();

但它不起作用。任何帮助将不胜感激。

Answer 1

我遇到了同样的问题，我在 resize 事件触发的函数上使用 Spy 解决了。

 it('should trigger onResize method when window is resized', () => {
    const spyOnResize = spyOn(component, 'onResize');
    window.dispatchEvent(new Event('resize'));
    expect(spyOnResize).toHaveBeenCalled();
 });

希望对你有帮助！