4
votes

Getting following error while running karma jasmine unit test case in angular 8

Component: admin-dialog > onModalCancel Error : Expected undefined to be truthy.

I had provided my spec and typescript file. pls suggest why am getting Expected undefined to be truthy. appropriate in advance

Spec file

import { AdminDialogComponent } from "./admin-dialog.component";
import {TestBed, ComponentFixture, async, inject, tick, fakeAsync} from '@angular/core/testing';
import { FormsModule } from "@angular/forms";
import { BrowserDynamicTestingModule } from '@angular/platform-browser-dynamic/testing';
import {TranslateModule,TranslateService} from "@ngx-translate/core";
import {Inject, NO_ERRORS_SCHEMA} from "@angular/core";
import {MAT_DIALOG_DATA, MatDialog, MatDialogModule, MatDialogRef} from '@angular/material/dialog';
import { OverlayContainer } from '@angular/cdk/overlay';
import {HttpClientModule} from "@angular/common/http";
import {RouterTestingModule} from "@angular/router/testing";
import {DataService} from "../../../services/data.service";
import {of} from "rxjs/internal/observable/of";

describe('Component: admin-dialog', () => {

  let component: AdminDialogComponent;
  let fixture: ComponentFixture<AdminDialogComponent>;
  let translate: TranslateService;
  let dialog: MatDialog;
  let overlayContainer: OverlayContainer;
  let dataService: DataService;
  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [FormsModule, MatDialogModule, HttpClientModule,RouterTestingModule,TranslateModule.forRoot()],
      declarations: [AdminDialogComponent],
      providers: [TranslateService,
        { provide: MatDialogRef, useValue: {addPanelClass: ()=>{'close-modal'} }},
        {
          provide: MAT_DIALOG_DATA, useValue: {
            isNew: false, // I guess it's boolean
            adminObj: {firstName: "AAAAAA", lastName: "AA", password: null, emailId: "[email protected]"}
          }
        },
        {provide: dataService, useValue: {}}
      ],
      schemas: [NO_ERRORS_SCHEMA]
  });
    TestBed.overrideModule(BrowserDynamicTestingModule, {
      set: {
        entryComponents: [AdminDialogComponent]
      }
    });
    TestBed.compileComponents();
    fixture = TestBed.createComponent(AdminDialogComponent);
    component = fixture.componentInstance;
  });
  beforeEach(inject([MatDialog, OverlayContainer],
    (d: MatDialog, oc: OverlayContainer) => {
      dialog = d;
      overlayContainer = oc;
    })
  );
  afterEach(() => {
    overlayContainer.ngOnDestroy();
  });
  it('should create', () => {
    expect(component).toBeTruthy();
  });
  it("onModalCancel", () => {
      expect(component.onModalCancel()).toBeTruthy();
  });

});

Ts file

import {Component, Inject, OnInit} from "@angular/core";
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material";
import {DataService} from "../../../services/data.service";
@Component({
  selector: 'admin-dialog',
  templateUrl: './admin-dialog.component.html',
  styleUrls: ['./admin-dialog.component.scss']
})
export class AdminDialogComponent implements OnInit {
  public accessHasSelected : any ='';
  public errorObj : any = {};
  public checkBoxSelected : boolean;
  public adminObj: any = {
    active:true,
    firstName:"",
    lastName:"",
   // emailId:"",
    access:[]
  };
  /***
   *
   * @param dialogRef
   * @param data
   * @param fromGroup
   * @param dataService
   */
  constructor(
    public dialogRef: MatDialogRef<AdminDialogComponent>,
    @Inject(MAT_DIALOG_DATA) public data: any,
    private dataService: DataService) {

    if (this.data.isNew){
      this.newAdmin();
    }
    else {
      this.editAdmin(this.data.adminObj);
    }
  }
  /*
  * This method will get called while loading new admin modal.
  * */
  newAdmin() {
    this.dataService.getAllAdminAccess().subscribe(
      response => {
        this.adminObj.access = response.access;
      },
      error => { });
  }
  /***
   * This method will get called while loading edit existing admin modal.
   * @param response
   */
  editAdmin(response){
    console.log(response);
    this.dataService.getAdminDetails(response.emailId).subscribe(
      response => {
        //component related success actions
        this.adminObj = response;
      },
      error => {});
  }
  /**
   *
   */
  ngOnInit() {}
  onModalCancel(): void {
    this.dialogRef.addPanelClass('close-modal');
    setTimeout(()=>{
      this.dialogRef.close();
    },500);
  }
}
1
@Buczkowski could you help me on thisvas
why are you testing void function as if it was returning a boolean value?Alexus
@Alexus how to cover the test case for the onModalCancel()vas

1 Answers

0
votes

ngOnInit() is not returning any value. Hence it shows undefined.

To check if the function is defined, you can write test case like below:

it("onModalCancel", () => {
      expect(component.onModalCancel).toBeDefined();
  });