Угловое тестирование Невозможно прочитать свойство 'данные' из неопределенного

Question

Я пытаюсь написать тестовый пример для компонента, но получаю сообщение об ошибке, так как не могу прочитать свойство 'данные' из неопределенного. Я использую угловой 6. Пожалуйста, посмотрите на метод deleteDomain(). Я пытаюсь написать тестовый пример для компонента, но я получаю сообщение об ошибке, так как не могу прочитать свойство 'data' undefined. Я использую угловой 6. Пожалуйста, посмотрите на deleteDomain() метод.

Здесь Мой код для компонента

    export class GridRendererComponent implements ICellRendererAngularComp {
      public params: any;
      // Icons
      faEdit = faEdit;
      faTrashAlt = faTrashAlt;

      constructor(private router: Router, public dialog: MatDialog) {}

      agInit(params: any): void {
        this.params = params;
      }
      deleteDomain() {
        this.dialog.open(ConfirmDialogComponent, {
          panelClass: '_small-dialog',
          disableClose: true,
          position: { top: '50px' },
          data: {
            title: 'Delete Domain',
            description: `Are you sure do you want to delete domain Contract ID: ${
              this.params.data.contactId
            }?`
          }
        });
      }
     }

Вот код ниже для спецификации, которую я попробовал

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

    import { GridRendererComponent } from './grid-renderer.component';
    import { RouterTestingModule } from '@angular/router/testing';
    import { FeaturesModule } from '../../features.module';
    import { Routes, Router } from '@angular/router';
    import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 
    import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
    import { NAccessRequestComponent } from '../../n-access-request/n-access-request.component';

    const routes: Routes = [
      { path: 'n-access-request', component: NAccessRequestComponent },
    ];

    describe('GridRendererComponent', () => {
      let gridRendererComponent: GridRendererComponent;
      let dialog : MatDialog;
      let router: Router;

      beforeEach(() => {
        TestBed.configureTestingModule({
          imports: [
            RouterTestingModule.withRoutes(routes),
            FeaturesModule,
            BrowserAnimationsModule
          ],
          declarations: [ ]
        })

        .compileComponents();
        router = TestBed.get(Router);
        router.initialNavigation();
      });

      beforeEach(() => {
        const fixture = TestBed.createComponent(GridRendererComponent);
        gridRendererComponent = fixture.componentInstance;
        fixture.detectChanges();
      });

      it('should create', () => {
        expect(gridRendererComponent).toBeTruthy();
      });

      it('agInit', () => {
        let params = {
              "column" : "status"
               };
        gridRendererComponent.agInit(params);
        expect(gridRendererComponent.params).not.toBe(null);
      });


      it('approveRequest', () =>{
        let params = {
          "data" : {
            "contactId" : '5',
            }
           };
        spyOn(gridRendererComponent.dialog, 'open').and.returnValue(true);
        gridRendererComponent.deleteDomain();
        expect(gridRendererComponent.dialog.open).toHaveBeenCalled();
        expect(gridRendererComponent.params.data.contactId).not.toBe(null);
      });

    });

Answer 1

Я обнаружил несколько ошибок, которые вы сделали, опять же, вопрос сам по себе имеет недостаток информации.

Первый: определите ваши компоненты внутри закрытия declaration.Я обнаружил, что вам нужно добавить 2 компонента: GridRendererComponent и ConfirmDialogComponent.

. Вам не нужно запускать навигацию маршрутизатора с самого начала.

// router = TestBed.get(Router);
// router.initialNavigation();

ИзменитеСледуя методу spyOn,

spyOn(gridRendererComponent.dialog, 'open');

Поскольку вы следите за методом, он никогда не будет вызываться, поэтому вам не нужно определять data объект здесь.Отсюда и последнее утверждение.

// expect(gridRendererComponent.params.data.contactId).not.toBe(null);