rxjs- spy (英语)

这是什么?

rxjs-spy 是 RxJS 的调试库 .

你为什么需要它?

调试基于 RxJS 代码的常用方法涉及 sprinkling do 操作员和伐木者 整个由观察物组成的。 我认为这是很乏味的, 所以我写了这个图书馆, 并实施了一种无侵扰性的机制, 以识别可观测和伐木, 检查可观测的订阅.

如果你也在找一个不那么痛苦的 RxJS 调试经验,你可能会觉得这个库是有用的. Slack的工程师们收养了 rxjs-spy 并且已经 这是说 关于它:

你可能会说,"[.] 但观察者不是无法调试的吗?" 你大概不到一年前就是对的 但这是 JavaScript 和 JavaScript, 唯一的 const 变化. rxjs-spy 使调试(即记录和可视化)流变得简单如添加 a tag。可以从控制台上监视、暂停和重放标记的流.

欲了解图书馆如何运作及能做些什么,请查看:

• 调试 RxJS 第 1 部分: 工具。 。 。 .
• 调试 RxJS, 第 2: 日志。 。 。 .
• 网上有个例子 GitHub 页面。 。 。 .

安装

使用国家防范机制安装软件包:

npm install rxjs-spy --save-dev

并导入用于 TypeScript 或 ES2015 的函数:

import { create } from "rxjs-spy";
const spy = create();

或者说 require 用于节点或普通JS捆绑器的模块:

const { create } = require("rxjs-spy");
const spy = create();

或包括用作 script数字 :

<script src="https://unpkg.com/rxjs@6/bundles/rxjs.umd.min.js"></script>
<script src="https://unpkg.com/rxjs-spy@7/bundles/rxjs-spy.min.umd.js"></script>
<script>
const { create } = rxjsSpy;
create();
</script>

核心概念

rxjs-spy 介绍a tag 可用于识别可观测物的运算符。 它给可观察者附加了字符串标记;它不进行额外的处理,也不以任何方式改变可观察者的行为或价值.

这个 tag 运算符可用 pipe数字 :

import { tag } from "rxjs-spy/operators/tag";
const source = Observable.of("some-value").pipe(tag("some-tag"));

API的方法基于标记,并可以使用明确的文字,正则表达式或函数上游来匹配标记. 例如,可以启用上述标记的日志:

import { create } from "rxjs-spy";
const spy = create();
spy.log("some-tag");

// Or like this:
spy.log(/^some-tag$/);

// Or like this:
spy.log(tag => tag === "some-tag");

rxjs-spy 曝光拟从代码调用的一个模块 API 和一个控制台 API - 通过 spy global - 拟通过浏览器控制台交互使用.

模块 API

模块 API 中的方法可以通过导入、 需要或 UMD 调用 rxjsSpy 全球。 多数方法返回一个将取消API方法在被调用时的动作的被拆解函数.

• create
• Spy.show
• Spy.log
• Spy.pause
• Spy.let
• Spy.debug
• Spy.flush
• Spy.plug
• Spy.unplug
• Spy.find
• Spy.findAll
• Spy.stats
• Spy.teardown
• detect

创建

function create(options: {
    [key: string]: any,
    audit?: number,
    defaultLogger?: PartialLogger,
    defaultPlugins?: boolean,
    warning?: boolean
} = {}): Teardown

通话 create 把间谍交给 Observable.prototype.subscribe 并返回以下接口:

interface Spy {
  readonly tick: number;
  debug(match: Match, ...notifications: Notification[]): Teardown;
  find<T extends Plugin>(ctor: Ctor<T>): T | undefined;
  findAll<T extends Plugin>(ctor: Ctor<T>): T[];
  findAll(): Plugin[];
  flush(): void;
  let(match: Match, select: (source: Observable<any>) => Observable<any>, options?: Options): Teardown;
  log(match: Match, partialLogger?: PartialLogger): Teardown;
  log(partialLogger?: PartialLogger): Teardown;
  pause(match: Match): Deck;
  plug(...plugins: Plugin[]): Teardown;
  show(match: Match, partialLogger?: PartialLogger): void;
  show(partialLogger?: PartialLogger): void;
  stats(partialLogger?: PartialLogger): void;
  teardown(): void;
  unplug(...plugins: Plugin[]): void;
}

默认, create 将连接快照插件和其他许多插件。 但是,如果 defaultPlugins 选项指定为 false中,没有插件会被连接,调用者可以单独使用 plug 方法。 例如:

import { create } from "rxjs-spy";
import { GraphPlugin, SnapshotPlugin } from "rxjs-spy/plugin";
const spy = create({ defaultPlugins: false });
spy.plug(
  new GraphPlugin({ keptDuration: -1 }),
  new SnapshotPlugin(spy, { keptValues: 1 })
);

如果 audit 选项,将在指定的(毫秒)期限内对通知的记录进行审计。 每个通知来源在每个期间只记录一次,被忽略的通知(如果有的话)的数目将包括在控制台输出中。 这对记录高频观测数据可能有用. audit 默认为零 - 即不审计.

转到 create 被传送到插件上,所以可以指定以下内容:

这种方法返回了拆解函数 .

显示

interface Spy {
  show(
    match: string | RegExp | MatchPredicate | Observable<any>,
    partialLogger: PartialLogger = console
  ): void;
  show(
    partialLogger: PartialLogger = console
  ): void;
}

show 将记录与控制台或指定的日志匹配的可观测信息。 若无 match 指定,所有标记的可观测数据都将被记录.

已登录的信息是从最新的快照中检索到的,所以如果快照无法启用,则会出错.

日志

interface Spy {
  log(
    match: string | RegExp | MatchPredicate | Observable<any>,
    partialLogger: PartialLogger = console
  ): Teardown;
  log(
    partialLogger: PartialLogger = console
  ): Teardown;
}

连接日志插件的示例以匹配可观察值 。 如果没有 match 指定,所有标记的可观测数据都将被记录.

全体 subscribe, (中文(简体) ), next, (中文(简体) ), complete, (中文(简体) ), error 财务报告和审定财务报表 unsubscribe 通知将登录到控制台或指定的日志上.

这种方法返回了拆解函数 .

暂停

interface Spy {
  pause(
    match: string | RegExp | MatchPredicate | Observable<any>
  ): Deck;
}

为匹配可观测到的暂停插件设置一个实例 .

所有匹配可观测对象的订阅将被设置为暂停状态,否则将发布的通知将在插件内被缓冲.

此方法返回 a Deck 实例 resume 财务报告和审定财务报表 pause 观察者.

interface Deck {
  readonly paused: boolean;
  clear(): void;
  log(partialLogger: PartialLogger = console): void;
  pause(): void;
  resume(): void;
  skip(): void;
  step(): void;
  teardown(): void;
}

通话 step 将发布一次暂停通知。 其他方法 他们的名字暗示。 通话 resume 将在恢复前播放所有缓冲通知.

让

interface Spy {
  let(
    match: string | RegExp | MatchPredicate | Observable<any>,
    select: (source: Observable<any>) => Observable<any>,
    options?: Options
  ): Teardown;
}

连接一个用于匹配可观察到的放电插件的实例 .

这相当于 let 操作员。 匹配可观测对象的所有订阅将改为指定返回的可观测对象 select 函数.

若为 complete 选项 false,从选定的可观察者收到的完成通知将不转发给订阅者.

这种方法返回了拆解函数 .

调试

interface Spy {
  debug(
    match: string | RegExp | MatchPredicate | Observable<any>,
    ...notifications: ("complete" | "error" | "next" | "subscribe" | "unsubscribe")[]
  ): Teardown;
}

连接调试插件的实例, 以匹配可观察到的 .

当出现指定通知时 debugger 插件中的语句将暂停执行。 如果调用中未指定通知,则当任何通知发生时会暂停执行.

这种方法返回了拆解函数 .

冲出

interface Spy {
  flush(): void;
}

通话 flush 将看到 flush 调用每个插件 .

如果启用了快照, 请调用 flush 将会从快照中释放出多余的值并完成或出错的可操作性.

插头

interface Spy {
  plug(...plugins: Plugin[]): Teardown;
}

将指定的插件上线并返回一个被撕毁的功能.

取消插头

interface Spy {
  unplug(...plugins: Plugin[]): void;
}

删除指定的插件 .

寻找

interface Spy {
  find<T extends Plugin>(constructor: { new (...args: any[]): T }): T | undefined;
}

返回第一个匹配指定构造器/类的插件 .

查找全部

interface Spy {
  findAll<T extends Plugin>(constructor: { new (...args: any[]): T }): T[];
  findAll(): T[];
}

返回所有匹配指定构造器/类的插件 。 或者没有指定所有构造器的插件 .

数据

interface Spy {
  stats(partialLogger: PartialLogger = console): void;
}

写作,到控制台,计算通知数量等.

拆开

interface Spy {
  teardown(): void;
}

撕下间谍.

检测

function detect(id: string): void;

向控制台写上自上次以来发生的任何订阅和未订阅 detect 使用指定的调用 id。 。 。 .

这个 detect 方法被执行,以便可以导入和调用,无论间谍是否配置。 也就是说,电话可以在生产代码中留下,因为它们成为无操作程序. 应该这样进口:

import { detect } from "rxjs-spy/detect";

控制台 API

控制台中的方法 API 可以通过 spy global),并打算在浏览器控制台中交互使用.

它们与使用模块API创建的间谍事件的方法相同,只是它们不返回被撕毁的功能. 相反,可以使用 undo API方法.

• spy.undo
• spy.deck

撤销

function undo(...calls: number[]): void

在没有争论的情况下 undo 方法将在控制台显示列表 rxjs-spy 可以取消的电话.

电话按电话号码列出,其中一个或多个号码可转给 undo 以取消特定电话.

正在撤销 spy 电话会取消所有的电话.

甲板

function deck(call?: number): Deck | undefined

在控制台里,很容易忘记使用变量来捕捉 Deck 通过呼叫返回 pause。在这种情况下,你可以打电话给 deck 方法,不显示一个编号列表 pause 打电话 通话 deck 再通过一个电话, 将返回 Deck 与指定的 pause 电话.