An error was thrown in afterAll TypeError: Cannot read property 'ids' of undefined

Question

我是 angular 的新手，我尝试为我的组件编写简单的单元测试。我的测试不时失败，我收到以下错误：在 afterAll TypeError 中抛出错误：无法读取未定义的属性 'ids' 并且我还附加了错误跟踪

这是我的组件实现：

    ngOnInit() {
        this.groupValueForm.valueChanges.subscribe((group: BasicGroup) => {
          this.store.dispatch(GroupActions.selectGroup({ group: group }));
        });
        this.store.dispatch(GroupActions.getAllGroups());
        this.store.pipe(select(selectAllGroups)).subscribe((basicGroups: BasicGroup[]) => {
          this.groups = basicGroups;
        });
      }

这是我的测试class实现：

      beforeEach(() => {
        TestBed.configureTestingModule({
          imports: [
            TopPanelModule,
            STORE_MODULE_TEST
          ],
          providers: [
            { provide: COUNTRY_ID, useValue: 'sv-SE' },
            { provide: TranslateService, useValue: mockTranslateService },
            provideMockStore({ initialState })
          ]
        });
        store = TestBed.inject(MockStore);
        fixture = TestBed.createComponent(TopPanelComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
      });
    
      it('should create', () => {
        expect(component).toBeTruthy();
      });
    
      it('should use the groupList from store', (done: DoneFn)  => {
        spyOn(store, 'pipe').and.returnValue(of(groups));
        component.ngOnInit();
        store.pipe().subscribe(resp=>{
          expect(component.groups).toEqual(groups);
          done();
        })
      });
    
      it('should dispatch getAllGroups', () => {
        spyOn(component['store'], 'dispatch');
        component.ngOnInit();
        expect(component['store'].dispatch).toHaveBeenCalledWith(GroupActions.getAllGroups());
      });
    
      afterEach(() => {
        fixture.destroy();
      });

Answer 1

这是潜在的修复方法之一，因为您的错误表明 yourEntityFeatureSliceName（在以下情况下）是 undefined。另一方面，如果您不想覆盖初始状态，您可以随时覆盖选择器，正如我在评论中所写，它可以是 selectAll 或 selectEntities - selectAllGroups.

import {MockStore, provideMockStore} from '@ngrx/store/testing';

let store$: MockStore;

beforeEach(() => {
  TestBed.configureTestingModule({
    // Put other dependencies
    providers: [
      provideMockStore({
        initialState: {
          yourEntityFeatureSliceName: { // Update name
            ids: [],
            entities: {}
          }
        }
      })
    ]
  });

  store$ = TestBed.inject(MockStore);
});

覆盖选择器：

store.overrideSelector(selectAllGroups, {}); // Provide data

除此之外 - 请注意，您在测试用例中监视 store.pipe 并且第一个 fixture.detectChanges(); 调用在 beforeEach 中，因此 ngOnInit 将在监视之前执行。

An error was thrown in afterAll TypeError: Cannot read property 'ids' of undefined

An error was thrown in afterAll TypeError: Cannot read property 'ids' of undefined

unit-testing

jasmine

karma-jasmine

angular