unit-testing - angular2 测试，如何测试事件绑定(bind)到一个元素

Question

我正在为组件编写 angular2 单元测试。通过完全使用 JQuery，可以找到绑定(bind)到元素的事件。但是在 Angular2 中，我不确定这是否可能

比如下面的代码有一个click事件，它是一个组件的public函数

      <button (click)="doLogin()" [disabled]="myDisabled">Login</button>

通过读取 DOM 元素，我可以通过运行测试来确保所有属性和数据绑定(bind)都是正确的。我唯一不知道的是，“event 绑定(bind)是否正确”，因为生成的 html 如下所示

      <button>Login</button>

我想通过编写测试来确保将来不会有人删除此事件绑定(bind)。

总而言之，我如何知道事件已正确绑定(bind)到 DOM 元素？

编辑:有没有办法不用实际点击就知道有点击事件？

Answer 1

您可以使用下面的方法(调用点击:

it('should render list', injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
  return tcb.createAsync(MyList).then((componentFixture: ComponentFixture) => {
    const element = componentFixture.nativeElement;
    componentFixture.detectChanges();
    expect(element.querySelectorAll('li').length).toBe(5);
    document.getElementById('test').click();
  });
}));

有关详细信息，请参阅此问题:

• How can I trigger a JavaScript event click