将模拟DOM事件传递给Angular中的组件方法以进行单元测试

时间:2018-07-25 14:45:43

标签: angular unit-testing jasmine

我正尝试在我的一个组件中测试一种方法,如下所示:

toggle(event: Event): void {
    event.stopPropagation();
    this.isCollapsed = !this.isCollapsed;
}

例如,在单元测试用例中,我找不到将事件对象传递给方法的方法:

test('it should call stop propagation when toggled', () => {
    testHostComponent.toggleLineBreakDown(mockEventGoesHere, 0);
});

1 个答案:

答案 0 :(得分:5)

您可以测试是否已通过Jasmine Spy调用了preventDefault。

在使用SpyOn方法之前,您必须创建正在监听的事件。 (在以下示例中,这是一个“ click”事件)。创建事件和间谍之后,您将需要将事件调度到元素。

例如:

const event = new MouseEvent('click'); 
spyOn(event, 'preventDefault');

element.dispatchEvent(event);
expect(event.preventDefault).toHaveBeenCalled();

希望这会有所帮助!