Cannot read property 'findIndex' of undefined

Question

I'm trying to test one component in my application. In this component's constructor, I have a function findIndex, something like this:

  dels: Del[];
  selectedDel: number = null; // It is a index
  selectedMun: number = null; // It is a index

    constructor(private _emitService: EmitService, private _locService: LocService) {
        let data = <Perfil>JSON.parse(localStorage.getItem('data'));
        this.dels = data.dels;
        this.selectedDel = this.dels.findIndex(x => x.id_del == JSON.parse(localStorage.getItem('Del')));
        this.changeDel(this.selectedDel);
        this.selectedMun = JSON.parse(localStorage.getItem('Mun'));
        _emitService.filter({ idEvent: 'CloseSidenav' });
      }

I'm trying to do a simple 'should create', but I receive this error:

TypeError: Cannot read property 'findIndex' of undefined

My test:

  beforeEach(() => {
    fixture = TestBed.createComponent(ChangeDelMunComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

I have also tried this, but without success:

  beforeEach(() => {
    fixture = TestBed.createComponent(ChangeDelMunComponent);
    component = fixture.componentInstance;        
  });

  it('should create', () => {
    localStorage.setItem('data', '{"id_user":"1234edr","dels":[{"id_del":50,"desc":"DESC 1","mun":[]}');
    localStorage.setItem('Del', '11');
    fixture.detectChanges();
    expect(component).toBeTruthy();
  });
});

I googled it and I didn't find anything. What I'm doing wrong? Any help would be appreciated. Thanks in advance!

EDIT : updating the test to this :

describe('ChangeDelMunComponent', () => {
  let component: ChangeDelMunComponent;
  let fixture: ComponentFixture<ChangeDelMunComponent>;
    beforeEach(() => {
        TestBed.configureTestingModule({
          imports: [
            BrowserAnimationsModule,
            FormsModule,
            MatIconModule,
            MatCardModule,
            MatSelectModule,
            MatProgressBarModule,
            MatButtonModule,
            ToastrModule.forRoot(),
            HttpClientModule,
          ],
          declarations: [ChangeDelMunComponent],
          providers: [
            EmitService,
            LocalizacionesService
          ]
        })
          .compileComponents().then(() => {
            fixture = TestBed.createComponent(ChangeDelMunComponent);
            component = fixture.componentInstance;
            localStorage.setItem('data', '{"id_user":"1234edr","dels":[{"id_del":50,"desc":"DESC 1","mun":[]}');
            localStorage.setItem('Del', '11');
          });
      });

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

The error findIndex disappears, but another error comes:

TypeError: Cannot read property 'detectChanges' of undefined

Answer 1

I'v encountered the same issue, what solved mine was to avoid initializing arrays with undefined (array: undefined), instead use array: [].