2

我目前正在使用一个组件，在该组件中单击按钮会打开一个弹出窗口来问候用户。我正在使用角度材质对话框打开弹出窗口，点击时调用的组件代码块是

public openMatDialog(): void {
this.isDialogOpen = true;

this.dialogReference = this.dialog.open(GreetComponent, {
  autoFocus: false,
  disableClose: false,
});

this.dialogReference.afterClosed().subscribe(
  () => {
       this.isDialogOpen = false;
  }
);

}

我还需要检查布尔属性以指示对话框打开和关闭。

在组件规范中，我为对话框提供模拟以防止实际依赖，如下所示，

export class MatDialogMock {
   open() {
    return {
      afterClosed: () => of(true)
    };
  }
}

在规范提供者中，

{ provide: MatDialog, useValue: matDialog },

在之前的每个，

const matDialog = new MatDialogMock();

当我测试对话框打开时，如下所示，

  it('Greet User', () => {
    spyOn(matDialog, 'open');
    component.openMatDialog();
    expect(matDialog.open).toHaveBeenCalled();
  });

它因错误而失败，

Error: Expected spy open to have been called.

请指导如何使用规范中的模拟检查对话框打开。

4

1 回答 1

0

问题是const matDialog = new MatDialogMock();。你不应该掌握一个新的，你应该掌握你在TestBed.

const matDialog = fixture.debugElement.injector.get(MatDialog); // get actual instance provided then your test should be good.

在文档中查看具有依赖项的组件： https ://angular.io/guide/testing-components-scenarios#component-with-a-dependency

于 2020-11-19T20:11:08.887 回答