тестовый блок для открытого диалога

Question

Я написал тестовый блок для открытого диалога. Но я получаю сообщение об ошибке типа TypeError: Не удается прочитать свойство 'debugElement' из undefined. Я использую angular 7, пожалуйста, помогите мне, кто-нибудь. Я не могу опубликовать весь код компонента, который я разместил только методом диалога.

Код моего компонента

confirmDialog(): void {
    this.dialog.open(ConfirmDialogComponent, {
      panelClass: '_small-dialog',
      disableClose: true,
      position: { top: '50px' },
      data: { name: 'Confirm Dialog', description: 'Some description' }
    });
  }

Код моего спецификационного файла

import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { MyRequestsComponent } from './my-requests.component';
import { RouterTestingModule } from '@angular/router/testing';
import { FeaturesModule } from '../features.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 


describe('MyRequestsComponent', () => {
  let myReqComponent: MyRequestsComponent;
  let fixture:ComponentFixture < MyRequestsComponent > ; 
  let input:Element;


  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        RouterTestingModule,
        FeaturesModule,
        BrowserAnimationsModule
      ],
      declarations: [ ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    const fixture = TestBed.createComponent(MyRequestsComponent);
    myReqComponent = fixture.componentInstance;
    fixture.detectChanges();
  });


  it('should call open Dialog', () =>  {

    let button = fixture.debugElement.nativeElement.querySelector('button');
     button.click();

     fixture.whenStable().then(() => {
       expect(myReqComponent.confirmDialog).toHaveBeenCalled();
     });
    }); 
});

Кнопка включения моего HTML-кода

<button
                    mat-icon-button
                    color="accent"
                    matTooltip="Delete"
                    matTooltipPosition="above"
                    *ngIf="element.status === 'In progress'"
                    (click)="confirmDialog()"
                  >
                    <fa-icon [icon]="faTrashAlt"></fa-icon>
                  </button>

Answer 1

Вы сделали до того, как каждая асинхронная beforeEach(async(() => {..., и вам может потребоваться сделать асинхронный вызов.Попробуйте ниже

it('should call open Dialog', async() =>  {

    let button = fixture.debugElement.nativeElement.querySelector('a');
     button.click();

     fixture.whenStable().then(() => {
       expect(myReqComponent.confirmDialog).toHaveBeenCalled();
     });
});