I am trying to create cover all the line (Jasmine / Karma) but I am getting the error as Cannot read property 'preferences' of undefined

Here is my code for component code.

    export class PreferComponent implements OnInit {
  @Output() updatePreferences = new EventEmitter<any>();
  @ViewChild('settingModal', { static: true }) settingModal: any;
  private data: any;
  preferences = [];
  maxCols: number;
  selectedPref: number;
  constructor() { }

  ngOnInit(): void {
    this.preferences = JSON.parse(JSON.stringify(this.data.preferences));
    this.maxCols = this.data.maxCols;
    this.selectedPref = this.data.selectedPref;
    this.checkPreferences();
  }

  setPreferences(col, val) {
    if (val) {
      col.isPreferredColumn = true;
      this.selectedPref  ;
    } else {
      col.isPreferredColumn = false;
      this.selectedPref--;
    }
    this.checkPreferences();
  }
}

Here is the below code for spec which I tried:

   fdescribe('PreferComponent ', () => {
  let component: PreferComponent ;
  let fixture: ComponentFixture<PreferComponent >;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [PreferencesComponent],
      schemas: [CUSTOM_ELEMENTS_SCHEMA]

    })
      .compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(PreferComponent );
    fixture.detectChanges();

    component = fixture.componentInstance;
    const data1 = {
      preferences: [1, 2, 4],
      "maxCols": 5,
      "selectedPref": 7
    };
    component.preferences = data1.preferences;
    component.maxCols = data1.maxCols;
    component.selectedPref = data1.selectedPref;
    expect(component.preferences).toEqual([1, 2, 4]);

    component.ngOnInit();
  });
});

What I am doing wrong here?

CodePudding user response：

In the ngOnInit method, you're assigning this.preferences with a value obtained from this.data.

Therefore, in the beforeEach function, you should make the following change:

Instead of...

component.preferences = data1.preferences;

...write this:

@ts-ignore
component.data = data1;

Further you should move expect(component.preferences).toEqual([1, 2, 4]); after component.ngOnInit(); since this checks if ngOnInit did what you expected it to do.