角2.單元發射懸停事件測試

Question

我有模板一些（MyCmp）組件（<my-cmp></my-cmp>）這樣

<template ngFor let-r [ngForOf]="range" let-index="index"> 
    <span>{{ index < 5 ? 'Y' : 'N' }}, {{r.data}}</span> 
    <i (mouseenter)="somefunc()" (click)="elefunc()"></i> 
    .... 
</template> 

我通過特殊TestComponent

TestBed.configureTestingModule({declarations: [TestComponent], imports: [MyModule]} 
TestBed.overrideComponent(TestComponent, {set: {template: '<my-cmp></my-cmp>'}}); 
fixture = TestBed.createComponent(TestComponent); 
context = fixture.debugElement.componentInstance; 
element = fixture.nativeElement; 
fixture.detectChanges(); 

我配置MyCmp組件測試牀認爲這不重要。測試工作。

element.querySelectorAll('i')[0].click(); //fine 

但我不知道我應該怎麼發出懸停（的mouseenter）和鼠標離開事件

element.querySelectorAll('i')[0].hover() // not a function 
element.querySelectorAll('i')[0].mouseover() // not a function 
element.querySelectorAll('i')[0].createMouseEvent('mouseover') // not a function 

Answer 1

如果你還沒有爲這個答案，你可以使用nativeElement的dispatchEvent以下列方式：

element.dispatchEvent(new MouseEvent('mouseover', { 
    view: window, 
    bubbles: true, 
    cancelable: true 
}));