У меня есть угловой компонент, который подписывается на Observable внутри хука жизненного цикла ngOnInit
. Здесь есть и другие вещи, например, магазин NgRx, но это не имеет отношения к этому вопросу. Итак, соответствующий код:
...
ngOnInit() {
this.loginForm = this.formBuilder.group({
usernameOrEmail: ['', [Validators.required]],
password: ['', [Validators.required]]
});
this.authenticating$ = this.store.pipe(select(selectUserAuthenticating));
this.authenticating$
.pipe(takeUntil(this.destroy$))
.subscribe(authenticating =>
// This is the relevant part
authenticating ? this.loginForm.disable() : this.loginForm.enable()
);
}
...
Теперь я хотел бы проверить, вызывается ли this.loginForm.disable()
или this.loginForm.enable()
внутри authenticating$
Наблюдаемой подписки.
Я настроил такой тест, используя RxJs TestScheduler
с мраморным синтаксисом для проверки асинхронных наблюдаемых:
...
import { TestScheduler } from 'rxjs/testing';
...
describe('LoginComponent', () => {
...
beforeEach(async(() => {
let scheduler: TestScheduler;
...
});
beforeEach(() => {
fixture = TestBed.createComponent(LoginComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
beforeEach(() => {
scheduler = new TestScheduler((actual, expected) => {
expect(actual).toEqual(expected);
});
});
it('should disable the form while the user is authenticating', () => {
const formDisableSpy = jest.spyOn(component.loginForm, 'disable');
scheduler.run(({ hot, expectObservable }) => {
component.authenticating$ = hot('-a', { a: true });
expectObservable(component.authenticating$).toBe('-b', { b: true });
});
component.authenticating$.subscribe(authenticating => {
expect(authenticating).toBe(true);
expect(formDisableSpy).toHaveBeenCalled();
});
});
});
Однако результаты теста показывают, что функция this.loginForm.disable()
никогда не вызывалась. Однако значение authenticating
проверено надлежащим образом. Смотрите вывод консоли из теста Jest:
Expected mock function to have been called, but it was not called.
expect(authenticating).toBe(false);
> 133 | expect(component.loginForm.enable).toHaveBeenCalled();
| ^
Вопрос
Как проверить вызов функции внутри подписки Observable в угловом компоненте?