测试 ngrx 模拟商店时出现意外错误

Question

我想我找到了解决办法，去问题的最后

我用 jasmine-marbles 做了一个简单的测试，我收到了这个错误，我不知道发生了什么。有什么想法吗？

Expected $[0].notification.kind = 'E' to equal 'N'.

Expected $[0].notification.value = undefined to equal [ ].

Expected $[0].notification.error = TypeError: Cannot read property 'pools' of undefined to equal undefined.

Expected $[0].notification.hasValue = false to equal true.

池-management.component.ts

    @Component({
  selector: 'app-pool-list',
  templateUrl: './pool-list.component.html',
  styleUrls: ['./pool-list.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class PoolListComponent implements OnInit {

  pools$ = this.store.pipe(select(selectPools));

  constructor(private store: Store<fromPoolManagement.State>) { }

  addPool(): void {
    this.store.dispatch(PoolManagementActions.addPool({lot: 'XXX', user: 'XYZ', cutDate: new Date().toISOString()}));
  }

  ngOnInit(): void {
    this.store.dispatch(PoolManagementActions.getPools());
  }

}

池-management.selectors.ts

export const poolManagementSelector = createFeatureSelector('poolManagement');

export const selectPools = createSelector(
  poolManagementSelector,
  (state: State) => state.pools
);

池-list.component.spec.ts

fdescribe('PoolListComponent', () => {
    let component: PoolListComponent;
    let fixture: ComponentFixture<PoolListComponent>;
    let mockStore: MockStore<fromPoolManagement.State>;

    beforeEach(() => {
      const initialState = { pools: [] } as fromPoolManagement.State;
      TestBed.configureTestingModule({
        declarations: [PoolListComponent],
        providers: [provideMockStore({ initialState })],
      })
        .compileComponents();
      fixture = TestBed.createComponent(PoolListComponent);
      component = fixture.componentInstance;
      mockStore = TestBed.get(Store);
      fixture.detectChanges();
    });

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

    it('should work, but this test is not working', () => {
      const expected = cold('a', { a: []});
      expect(component.pools$).toBeObservable(expected);
    });

    afterEach(() => {
      fixture.destroy();
    });

  });

console.log（'expected'，预期）；

Answer 1

因为我的 app.module 有一个

StoreModule.forRoot([]),

我正在尝试使用 .forFeature:

测试延迟加载的模块

StoreModule.forFeature('poolManagement', poolManagementReducer),

我有一些未定义的错误，因为我的选择器无法找到商店的 poolManagement 部分。

我已经解决了为 MockStore 提供模拟状态的问题：

interface MockState {
    poolManagement: {
      pools: Array<Pool>
    };
  }
let mockStore: MockStore<MockState>;

并根据 MockState 设置初始状态：

const initialState = { poolManagement: { pools: [] } };

就是这样。如果有人有更好的解决方案请告诉我。

测试 ngrx 模拟商店时出现意外错误

Unexpected errors testing the ngrx mock store

angular

ngrx

jasmine-marbles