您如何在ngOnInit生命周期中测试可观察物？

问题描述

我看过很多关于测试可观察物的文章，包括writing marble tests，而且我仍然无法在ngOnInit周期中找到关于如何在组件中测试简单可观察物的直接答案。

ngOnInit(): void {
    this.selectedMembers$.subscribe((members) => {
        if (!!members) {
            this.store.dispatch(actions.getPcps());
        }
    });

    this.membersForm.valueChanges.subscribe((id) => {
        if (!!id.member_id) {
            if (id.member_id === 'null') {
                this.store.dispatch(actions.getMembers());

                return;
            }
            this.store.dispatch(
                actions.getSelectedMember({ member_id: id.member_id }),);
        }
    });

    this.config$.subscribe((config) => {
        if (!!config) {
            config.mobile_filters.controls.forEach((control) => {
                this.formControlService.addControlToFormGroup(
                    this.mobileFiltersForm,control,);
            });
        }
    });
}

以一种直接的方式监视此组件并检查这些可观察对象是否发出了某些东西？

 it('should test observables in ngOnInit',fakeAsync(() => {
    spyOn(component.selectedMembers$,'subscribe')
    let myData;
    component.selectedMembers$.subscribe((data) => {
        myData = data;
        console.log('data',data);
        expect(myData).toEqual(data);
    })
}));

解决方法

您要确切测试什么？

如果仅希望在测试完成之前调用订阅回调，则可以在测试（https://angular.io/api/core/testing/tick）中使用tick()方法：

it('should dispatch if members are provided / selected',fakeAsync(() => {
  // arrange
  const dispatchSpy = spyOn(component.store,'dispatch');
  const membersToEmit = ['member-1','member-2'];
  component.selectedMembers$ = of(membersToEmit) // of from 'rxjs';

  // act
  component.ngOnInit();
  // alternatively you could call:
  // fixture.detectChanges();

  tick();  // causes your Observable to emit,so that the subscribe callback gets called 

  // assert
  expect(dispatchSpy).toHaveBeenCalled();
}));

,

例如这部分：

this.selectedMembers$.subscribe((members) => {
    if (!!members) {
        this.store.dispatch(actions.getPCPs());
    }
});

在测试中：

const spy = spyOn(store,'dispatch');
component.selectedMembers$.next('abc');
expect(spy).toHaveBeenCalledWith('abc');

您在问这样的事情吗？