record canvas mutations

[Yuyz0112]

close #60, #261

This patch implements the canvas mutation observer. It consists of both the record and the replay side changes.

In the record side, we add a recordCanvas flag to indicate whether to record canvas elements and the flag defaults to false.
Different from our other observers, the canvas observer was disabled by default. Because some applications with heavy canvas usage may emit a lot of data as canvas changed, especially the scenarios that use a lot of drawImage API.
So the behavior should be audited by users and only record canvas when the flag was set to true.

In the replay side, we add a UNSAFE_replayCanvas flag to indicate whether to replay canvas mutations.
Similar to the recordCanvas flag, UNSAFE_replayCanvas defaults to false. But unlike the record canvas implementation is stable and safe, the replay canvas implementation is UNSAFE.
It's unsafe because we need to add allow-scripts to the replay sandbox, which may cause some unexpected script execution. Currently, users should be aware of this implementation detail and enable this feature carefully.

[Yuyz0112]

The detail of rrweb's sandbox implementation can be found here: https://github.com/rrweb-io/rrweb/blob/master/docs/sandbox.md

[Yuyz0112]

The interface of record and replay canvas:

// record
record({
  emit() {},
  recordCanvas: true // <- enable record canvas with this option
})

// replay
const replayer = new rrweb.Replayer(events, {
   UNSAFE_replayCanvas: true // <- enable replay canvas with this option
});
replayer.play();

[Sol0423]

目前最新版本为0.9.0该版本支持canvas的回放吗 添加上述代码后回放过程中页面依旧空白

[Yuyz0112]

@Sol0423 还没有 release 新版本，master 分支的代码包含这个 PR

[961998264]

@Sol0423没有发布新版本，master分支的代码还包含这个PR

目前，recordCanvas：true.会引发无限触发emit事件的问题，请问该如何解决

[Yuyz0112]

@961998264 是无限触发还是大量触发？是不是本身 canvas 有大量使用？