4

我正在尝试测试一个简单的加载器组件,该组件从我制作的 ngrx 选择器中获取其状态。选择器提供了一个对象(接口名称为 LoaderState){queue: number},我将其映射为布尔值以显示或隐藏加载器。

为了测试它,我正在使用来自ngrx的茉莉花弹珠和mockStore。我正在覆盖选择器,我正在创建一个具有预期值的预期冷可观察对象,然后我使用期望是可观察的。

我已按照ngrx 文档Angular Up conf 中的教程进行操作。

组件

export class LoaderComponent implements OnInit {
  state: Observable<boolean>

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

  ngOnInit() {
    this.state = this.store.select(selectLoader).pipe(
      map(state => !!state.queue)
    )
  }

}

规格

describe('LoaderComponent', () => {
  let component: LoaderComponent
  let fixture: ComponentFixture<LoaderComponent>
  let store: MockStore<State>
  let loaderSelector: MemoizedSelector<State, LoaderState>

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ LoaderComponent ],
      providers: [ provideMockStore()]
    }).compileComponents()
    store = TestBed.get(Store)
    loaderSelector = store.overrideSelector(selectLoader, {queue: 0})
  }))

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

  it('should hidden', () => {
    const expected = cold('(a|)', { a: false })
    expect(component.state).toBeObservable(expected)
  })
})

我希望测试通过并且代码运行没有问题,但是测试失败并且导致的错误是:

[ { frame: 0,
        notification: { kind: 'N', value: false, error: undefined, hasValue: true } ‍},‍
‍      { frame: 0,‍
‍        notification: { kind: 'C', value: undefined, error: undefined, hasValue: false } ‍} ]
     
    Expected $.length = 1 to equal 2. 
    Expected $[1] = undefined to equal Object({ frame: 0, notification: Notification({ kind: 'C', value: undefined, error: undefined, hasValue: false }) }).
4

0 回答 0