我正在使用Observable.fromEvent()和各种链接的运算符来处理mouseover事件。我将如何进行单元测试?

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);
    });

最佳答案

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。例如testing map() operator(顺便说一句,这些是mocha测试)。注意如何使用这种简短的符号cold('--1--2--3--|')来制作Hot和Cold Observable,然后使用 '--x--y--z--|' that comes from TestScheduler与预期的expectObservable进行比较。

如果您还想对cold(...)hot(...)和其他代码使用缩写符号,则需要获取源代码,并使用npm run build_test对其进行编译,然后对mocha使用与原始代码相同的选项。 See package.json mocha in default.opts 的默认选项。我现在不知道任何更简单的解决方案。

简短的符号只是使事情变得更容易和更易读,但实际上您并不需要它。您已经可以使用常规测试Observables(TestSchedulerColdObservableHotObservable),因为它们是标准rxjs包的一部分。 https://github.com/ReactiveX/rxjs/tree/master/src/testing(node_modules/rxjs/testing)

另请参阅:How to debug Observable values in Angualr2 / Typescript?

09-10 12:19
查看更多