如何从角度 10 中的“@angular-redux/store”中进行单元测试选择？答案

【问题标题】：how to unit test select from "@angular-redux/store" in angular 10?如何从角度 10 中的“@angular-redux/store”中进行单元测试选择？
【发布时间】：2020-10-05 10:30:32
【问题描述】：

我有一个减速器定义为：

export const dummy_reducer = (state: any = INITIAL_STATE, action: any): any => {


  const actionOptions = (actionType) => ({
    GET_EMPLOYEE_DETAILS: () => {
      return tassign(state, {
        emp_name: action.payload.emp_name
      });
    },

我在我的 component.ts 中使用它如下：

 @select(["dummy_reducer", "emp_name"])
  emp_name$: Observable<any>;

此外，当组件初始化时，我使用 emp_name$ 进行订阅，如下所示：

ngOnInit() { this.emp_name$.subscribe((详情) => { ………… } }); }

现在我的问题是如何为这个特定组件编写单元测试，当我运行 ng 测试时，我收到错误：

 Cannot read property 'subscribe' of undefined ...

在这个 ngOnInIt() 中。关于如何修复它的任何建议？请让我知道如何为此编写一个成功的规范文件。

【问题讨论】：

标签： angular unit-testing karma-jasmine angular10

【解决方案1】：

您需要导入NgReduxTestingModule，然后在组件中添加@select('loading') loading$: Observable<boolean>，我们可以对其进行测试：

const stub = MockNgRedux.getSelectorStub('loading');
stub.next(false);
stub.next(true);
stub.complete();

component.loading$
  .toArray()
  .subscribe(
    actualSequence => expect(actualSequence).toEqual([ false, true ]),
    null,
    done);

您甚至可以在 beforeEach 函数中模拟数据，以便它可用于所有测试 :)

取自 here 的代码参考查看更多测试示例

【讨论】：