Angular 2单元测试:如何测试上下文菜单和双击事件? [英] Angular 2 unit tests: How do I test for the context menu and double click events?

问题描述

我只是想让它工作

 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不是函数

I get the errors contextMenuEl[0].nativeElement.oncontextmenu is not a function and doubleClickEl[0].nativeElement.ondblclick is not a function

应用功能正常运行.是的，如果我更改这些事件以在模板和测试中单击，则所有这些都可以在测试中使用.

The app functionality works as expected. And yes, if I change these events to click in the template and in the test, it all works in the test.

推荐答案

这是触发上下文菜单更改的方法:

This is how to trigger a context menu change:

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

这是触发双击更改的方法:

This is how to trigger a double click change:

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

这篇关于Angular 2单元测试:如何测试上下文菜单和双击事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！