Angular 2单元测试:如何测试上下文菜单和双击事件?
问题描述:
我只是想这个工作Angular 2单元测试:如何测试上下文菜单和双击事件?
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不是函数
应用功能按预期工作。是的,如果我更改这些事件以在模板中和测试中单击,它都可以在测试中使用。
答
这是如何触发一个上下文菜单的变化:
contextMenuEl[0].triggerEventHandler("contextmenu", new MouseEvent("contextmenu"));
fixture.detectChanges();
这是如何触发双击变化:
doubleClickEl[0].triggerEventHandler("dblclick", new MouseEvent("dblclick"));
fixture.detectChanges();