TriggerEventHandler在单元测试角度4

Question

我有一个元素

<button class="next-btn" (mouseup)="someMethod()">Next</button>

我想在测试中模拟mouseup事件，我这样做

const nextBtnElem = fixture.debugElement.nativeElement;
const elem = nextBtnElem.getElementsByTagName('button')[1]
elem.triggerEventHandler('mouseup', null);

它不起作用，但如果我像这样改变它

const nextBtnElem = fixture.debugElement.query(By.css('.next-btn');
nextBtnElem.triggerEventHandler('mouseup', null);

现在它的工作。我不明白为什么第一个选项不起作用？

Answer 1

triggerEventHandler是Angular DebugElement上存在的函数。在您的第一个代码段中，您在DOM对象上调用triggerEventHandler，但不提供此功能。在DOM对象上，您可以使用dispatchEvent但是必须在触发事件和断言之间调用fixture.detectChanges();。