Angular Testing - Как проверить вызов функции внутри подписки Ob Observable? - PullRequest
0 голосов
/ 10 июля 2019

У меня есть угловой компонент, который подписывается на 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 в угловом компоненте?

...