Как проверить события RxJS

Question

Я обрабатываю событие при наведении курсора, используя Observable.fromEvent(), с различными связанными операторами. Как бы я пошел о модульном тестировании этого?

export const bindMouseover = (link) => Observable.fromEvent(link, 'mouseover')
    .filter(event => Nav.hasSubNav(event.target))
    .map(event => Nav.getSubNav(event.target))
    .filter(target => !Nav.elementIsVisible(target))
    .subscribe((target) => {
      Nav.hideElements(subNavs);
      Nav.showElement(target);
    });

Answer 1

В документации по RxJS 4 есть глава по тестированию цепочек RxJS, но принципы применимы и к RxJS 5: https://github.com/Reactive-Extensions/RxJS/blob/master/doc/gettingstarted/testing.md

Если вы хотите выполнить модульное тестирование пользовательских операторов или цепочек операторов RxJS, есть официальная документация: https://github.com/ReactiveX/rxjs/blob/master/doc/writing-marble-tests.md (однако, этот документ не сообщает вы, где вы можете импортировать функции, перечисленные там в вашем собственном коде).

Также посмотрите, как RxJS тестируется сам. Например тестирование map() оператор (кстати, это mocha тесты). Обратите внимание, как создаются горячие и холодные наблюдаемые с этой короткой нотацией cold('--1--2--3--|') а затем по сравнению с ожидаемым '--x--y--z--|' с помощью expectObservable это исходит от TestScheduler.

Если вы хотите использовать также краткую запись с cold(...), hot(...) и другие, вам нужно взять исходный код, скомпилировать его с npm run build_test а затем использовать те же параметры для mocha как оригинал. Увидеть package.json и параметры по умолчанию для mocha в default.opts, Я не знаю ни о каком более простом решении прямо сейчас.

Короткая запись делает вещи проще и удобочитаемее, но на самом деле вам это не нужно. Вы можете использовать обычный тест Observables (TestScheduler, ColdObservable а также HotObservable) уже так как они являются частью стандарта rxjs пакет. https://github.com/ReactiveX/rxjs/tree/master/src/testing (node_modules/rxjs/testing)

Также см.: Как отлаживать наблюдаемые значения в Angualr2 / Typescript?