Как вызвать кнопку события внутри компонента диалогового окна материала?

Question

У меня есть один компонент диалогового окна материала, и я пытаюсь открыть его и нажать кнопку «Подтвердить» внутри моего модального окна, но я получаю эту ошибку:

TypeError: confirmButton имеет значение null в http://localhost: 9876 / karma_webpack / main. js (строка 20740)

Я пробовал:

it('should open the modal and click in the confirm button', () => {
    spyOn(component.dialog,'open').and.callThrough();
    component.openDialog();
    const confirmButton = fixture.debugElement.query(By.css('#dialog-confirm-button'));
    confirmButton.triggerEventHandler('click', null);
    // my expect will be there later
});

Это мой диалог:

<div>
  <div mat-dialog-content>
    Opened dialog
  </div>
  <div mat-dialog-actions align="center">
    <button id="dialog-confirm-button" [mat-dialog-close]="true" mat-flat-button
      color="accent">Confirm</button>
    <button id="dialog-cancel-button" [mat-dialog-close]="false" mat-flat-button color="primary">
      Cancel
    </button>
  </div>
</div>

Это моя openDialog() функция:

openDialog(): Observable<boolean> {
    const dialogRef = this.dialog.open(DialogComponent);
    return dialogRef.afterClosed();
}