Question

在Angular应用程序中，我正在编写一些集成测试，其中有一个ngx-bootstrap modal

在集成测试中，我正在测试一个组件，该组件包含一个弹出模式的按钮。在模态内部，有一个“保存”按钮，在测试过程中单击。

在模态组件内部，该按钮在单击时触发一个方法： (click)=onSave()，这就是模态组件的样子：

constructor(
  protected bsModalRef: BsModalRef,
) {}


onSave() {
  // do some stuff (NOTE: this part is actually executed during the test)
  this.bsModalRef.hide();
}

一切正常，但模态不会消失。但是onSave()方法已正确执行。

这很奇怪，因为如果我在测试运行完成后手动单击按钮，它将正确地隐藏模态

但是在测试过程中，尽管按钮正确接收到点击并触发了onSave()方法的执行，但模式并没有消失。

注意：这里不涉及任何间谍，由于它是一个集成测试，因此我不希望模拟hide()方法，而实际上要使其在测试过程中起作用，然后断言该模式已正确消失以及我的自定义onSave()方法的其他副作用。

Answer 1

您能否在测试实用程序“ page-object.ts”的clickElement方法中尝试使用此方法

来自：

clickElement(element: HTMLElement): void {
    element.click();
    this.fixture.detectChanges();
  }

收件人：

clickElement(element: HTMLElement): void {
    element.dispatchEvent(new MouseEvent('click'));
    this.fixture.detectChanges();
  }

Example of fakeAsync和tick（）测试

Answer 2

显示模态参考时，需要将其保存在this.modalRef中。

df.head()

Answer 3

我遇到了同样的问题，我通过首先模拟 setTimeout 来修复它

jasmine.clock().install()

然后调用：

this.modalService.hide(this.modalRef.id)

然后调用（如果在选项中将动画设置为 true，则使用 300 而不是 1）

jasmine.clock().tick(1)

然后关闭：

jasmine.clock().uninstall()

但是，当我使用 this.modalRef.hide() 时它仍然不起作用:(

ngx-bootstrap模态在测试期间不会隐藏

3 个答案: