Angular testing using jest and spectator fails TypeError: testing.waitForAsync is not a function

920 Views Asked by At

I am using Angular CLI: 10.2.3 Node: 12.22.1 npm: 6.14.12

I am new to angular. I am trying to use jest for testing angular code (project runs fine without any errors, now adding some tests where I see issue). I have many custom services so using Spectator to mock them. I have few tests, one of them (failing) is below.

A simple component test is as below.

import { HttpClientTestingModule } from '@angular/common/http/testing';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatDialog } from '@angular/material/dialog';
import { RouterTestingModule } from '@angular/router/testing';
import { MyComponent } from './my.component';

import { BasicAuthService } from './../../services/auth/basic-auth.service';
import { RefdataService } from '../../services/common/refdata.service';
import { of } from 'rxjs';
import {MyUploadService} from '../../services/data/my-upload.service';

import { 
  createComponentFactory, 
  createHostFactory, 
  Spectator, 
  SpectatorHost
} from '@ngneat/spectator/jest';

import { ObjectKeysPipe } from '../../pipes/common/object-keys.pipe';
import { DatePipe } from '@angular/common';

import { MockProxy, mock, mockReset } from 'jest-mock-extended'; 
import { NO_ERRORS_SCHEMA } from '@angular/core';

//Create a MatDialog mock class 
export class MatDialogMock {
  
  open() {
    return {
      afterClosed: () => of({action: true})
    };
  }
}

describe('MyUploadComponent', () => {

  let spectator: Spectator<MyUploadComponent>;

  const createComponent = createComponentFactory({
    component: MyUploadComponent,
    declarations: [MyUploadComponent, ObjectKeysPipe],
    imports: [HttpClientTestingModule,
              MatSnackBarModule,
              RouterTestingModule
             ],
    schemas: [NO_ERRORS_SCHEMA],
    mocks: [BasicAuthService,
            RefdataService,
            MyUploadService
           ],
    detectChanges: false
  });

  beforeEach(()=> {
    spectator= createComponent();
    spectator.detectChanges();
  });

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

});

I am getting the following error:

 FAIL  src/app/components/my-upload/my-upload.component.spec.ts
  ? Test suite failed to run

    TypeError: testing.waitForAsync is not a function

      38 |   let spectator: Spectator<MyUploadComponent>;
      39 |
    > 40 |   const createComponent = createComponentFactory({
         |                           ^
      41 |     component: MyUploadComponent,
      42 |     declarations: [MyUploadComponent, ObjectKeysPipe],
      43 |     imports: [HttpClientTestingModule,

      at Object.baseCreateComponentFactory [as createComponentFactory] (node_modules/projects/spectator/src/lib/spectator/create-factory.ts:77:5)
      at Object.createComponentFactory (node_modules/projects/spectator/jest/src/lib/spectator.ts:19:10)
      at src/app/components/my-upload/my-upload.component.spec.ts:40:27
      at ZoneDelegate.Object.<anonymous>.ZoneDelegate.invoke (node_modules/zone.js/dist/zone.js:386:30)
      at Zone.Object.<anonymous>.Zone.run (node_modules/zone.js/dist/zone.js:143:47)
      at Object.<anonymous> (src/app/components/my-upload/my-upload.component.spec.ts:36:1)

I am unable to find anything related to this error. I am not using explicitly waitForAsync. What should be the issue here?

0

There are 0 best solutions below