Angular 2单元测试：如何测试上下文菜单和双击事件？

Question

我只是想这个工作

let fixture: any = TestBed.createComponent(ComponentBeingTested); 
     fixture.detectChanges(); 
     const contextMenuEl: DebugElement[] = fixture.debugElement.queryAll(By.css("td"); 
     contextMenuEl[0].nativeElement.oncontextmenu(); 
     const doubleClickEl: DebugElement[] = fixture.debugElement.queryAll(By.css("li"); 
     doubleClickEl[0].nativeElement.ondblclick(); 

如果是这种成分的模板：

<td (contextmenu)="contextMenuFunction">Context Menu</td> 
<li (dblclick)="dblClickFunction">Double click</li> 

我得到的错误contextMenuEl [0] .nativeElement.oncontextmenu不是一个函数和doubleClickEl [ 0] .nativeElement.ondblclick不是函数

应用功能按预期工作。是的，如果我更改这些事件以在模板中和测试中单击，它都可以在测试中使用。

Answer 1

这是如何触发一个上下文菜单的变化：

contextMenuEl[0].triggerEventHandler("contextmenu", new MouseEvent("contextmenu")); 
fixture.detectChanges(); 

这是如何触发双击变化：

doubleClickEl[0].triggerEventHandler("dblclick", new MouseEvent("dblclick")); 
fixture.detectChanges();