angular component test -jest

test.ts

import { HttpClient } from '@angular/common/http';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { Router } from '@angular/router';
import { RouterTestingModule } from '@angular/router/testing';
// tslint:disable-next-line: max-line-length
import { FakeMissingTranslationHandler, MissingTranslationHandler, TranslateDefaultParser, TranslateLoader, TranslateModule, TranslateParser } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { mockAuthConfig, mockOidcConfig } from '../mock/testData';
import { AuthService, AUTH_CONFIG, OIDC_CONFIG } from '../services/auth.service';
import { LoginComponent } from './login.component';

// AoT requires an exported function for factories
export function createTranslateLoader(http: HttpClient) {
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

Object.defineProperty(window, 'addEventListener', { value: jest.fn() });

const routerStub = {
  navigate: jest.fn()
};

describe('LoginComponent', () => {
  let component: LoginComponent;
  let fixture: ComponentFixture<LoginComponent>;
  let authService: AuthService;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [
        TranslateModule.forRoot({
          loader: { provide: TranslateLoader, useFactory: (createTranslateLoader), deps: [HttpClient] },
          parser: { provide: TranslateParser, useClass: TranslateDefaultParser },
          missingTranslationHandler: { provide: MissingTranslationHandler, useClass: FakeMissingTranslationHandler }
        }),
        HttpClientTestingModule,
        RouterTestingModule
      ],
      declarations: [LoginComponent],
      providers: [
        // {
        //   provide: AuthService,
        //   useValue: authServiceMock
        // },
        AuthService,
        {
          provide: Router,
          useValue: routerStub
        },
        {
          provide: AUTH_CONFIG,
          useValue: mockAuthConfig
        },
        {
          provide: OIDC_CONFIG,
          useValue: mockOidcConfig
        }
      ],
      schemas: [
       NO_ERRORS_SCHEMA // this is nice to have IF we do not have any click tests
      ]
    });

    authService = TestBed.get(AuthService);
    fixture = TestBed.createComponent(LoginComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

  it('should return correct src url if not authenticated', () => {
    jest.spyOn(authService, 'isAuthenticated').mockReturnValue(false);
    jest.spyOn(authService, 'isAuthorized').mockReturnValue(false);
    expect(component.srcUrl).toBeDefined();
    expect(window.addEventListener).toBeCalled();
  });

  it('should navigate to denied page if not authorized', () => {
    jest.spyOn(authService, 'isAuthenticated').mockReturnValue(true);
    jest.spyOn(authService, 'isAuthorized').mockReturnValue(true);
    expect(routerStub.navigate).toBeCalledTimes(1);
  });
});