@highlight-run/rrweb 1.1.3 → 1.1.7

package/dist/record/mutation.d.ts

@@ -1,6 +1,7 @@
 import { MaskInputOptions, SlimDOMOptions, MaskTextFn, MaskInputFn } from '../snapshot';
 import { mutationRecord, blockClass, maskTextClass, mutationCallBack, Mirror } from '../types';
 import { IframeManager } from './iframe-manager';
+import { CanvasManager } from './observers/canvas/canvas-manager';
 import { ShadowDomManager } from './shadow-dom-manager';
 export default class MutationBuffer {
     private frozen;
@@ -29,12 +30,14 @@ export default class MutationBuffer {
     private mirror;
     private iframeManager;
     private shadowDomManager;
-    init(cb: mutationCallBack, blockClass: blockClass, blockSelector: string | null, maskTextClass: maskTextClass, maskTextSelector: string | null, inlineStylesheet: boolean, maskInputOptions: MaskInputOptions, maskTextFn: MaskTextFn | undefined, maskInputFn: MaskInputFn | undefined, recordCanvas: boolean, slimDOMOptions: SlimDOMOptions, doc: Document, mirror: Mirror, iframeManager: IframeManager, shadowDomManager: ShadowDomManager, enableStrictPrivacy: boolean): void;
+    private canvasManager;
+    init(cb: mutationCallBack, blockClass: blockClass, blockSelector: string | null, maskTextClass: maskTextClass, maskTextSelector: string | null, inlineStylesheet: boolean, maskInputOptions: MaskInputOptions, maskTextFn: MaskTextFn | undefined, maskInputFn: MaskInputFn | undefined, recordCanvas: boolean, slimDOMOptions: SlimDOMOptions, doc: Document, mirror: Mirror, iframeManager: IframeManager, shadowDomManager: ShadowDomManager, canvasManager: CanvasManager, enableStrictPrivacy: boolean): void;
     freeze(): void;
     unfreeze(): void;
     isFrozen(): boolean;
     lock(): void;
     unlock(): void;
+    reset(): void;
     processMutations: (mutations: mutationRecord[]) => void;
     emit: () => void;
     private processMutation;

package/dist/record/observer.d.ts

@@ -3,8 +3,9 @@ import { mutationCallBack, observerParam, listenerHandler, scrollCallback, block
 import MutationBuffer from './mutation';
 import { IframeManager } from './iframe-manager';
 import { ShadowDomManager } from './shadow-dom-manager';
+import { CanvasManager } from './observers/canvas/canvas-manager';
 export declare const mutationBuffers: MutationBuffer[];
-export declare function initMutationObserver(cb: mutationCallBack, doc: Document, blockClass: blockClass, blockSelector: string | null, maskTextClass: maskTextClass, maskTextSelector: string | null, inlineStylesheet: boolean, maskInputOptions: MaskInputOptions, maskTextFn: MaskTextFn | undefined, maskInputFn: MaskInputFn | undefined, recordCanvas: boolean, slimDOMOptions: SlimDOMOptions, mirror: Mirror, iframeManager: IframeManager, shadowDomManager: ShadowDomManager, rootEl: Node, enableStrictPrivacy: boolean): MutationObserver;
+export declare function initMutationObserver(cb: mutationCallBack, doc: Document, blockClass: blockClass, blockSelector: string | null, maskTextClass: maskTextClass, maskTextSelector: string | null, inlineStylesheet: boolean, maskInputOptions: MaskInputOptions, maskTextFn: MaskTextFn | undefined, maskInputFn: MaskInputFn | undefined, recordCanvas: boolean, slimDOMOptions: SlimDOMOptions, mirror: Mirror, iframeManager: IframeManager, shadowDomManager: ShadowDomManager, canvasManager: CanvasManager, rootEl: Node, enableStrictPrivacy: boolean): MutationObserver;
 export declare function initScrollObserver(cb: scrollCallback, doc: Document, mirror: Mirror, blockClass: blockClass, sampling: SamplingStrategy): listenerHandler;
 export declare const INPUT_TAGS: string[];
 export declare function initObservers(o: observerParam, hooks?: hooksParam): listenerHandler;

package/dist/record/observers/canvas/2d.d.ts

@@ -1,2 +1,2 @@
-import { blockClass, canvasMutationCallback, IWindow, listenerHandler, Mirror } from '../../../types';
-export default function initCanvas2DMutationObserver(cb: canvasMutationCallback, win: IWindow, blockClass: blockClass, mirror: Mirror): listenerHandler;
+import { blockClass, canvasManagerMutationCallback, IWindow, listenerHandler, Mirror } from '../../../types';
+export default function initCanvas2DMutationObserver(cb: canvasManagerMutationCallback, win: IWindow, blockClass: blockClass, mirror: Mirror): listenerHandler;

package/dist/record/observers/canvas/canvas-manager.d.ts

@@ -0,0 +1,32 @@
+import { blockClass, canvasMutationCallback, IWindow, Mirror } from '../../../types';
+export declare type RafStamps = {
+    latestId: number;
+    invokeId: number | null;
+};
+export declare class CanvasManager {
+    private pendingCanvasMutations;
+    private rafStamps;
+    private mirror;
+    private mutationCb;
+    private resetObservers;
+    private frozen;
+    private locked;
+    reset(): void;
+    freeze(): void;
+    unfreeze(): void;
+    lock(): void;
+    unlock(): void;
+    constructor(options: {
+        recordCanvas: boolean | number;
+        mutationCb: canvasMutationCallback;
+        win: IWindow;
+        blockClass: blockClass;
+        mirror: Mirror;
+    });
+    private processMutation;
+    private initCanvasMutationObserver;
+    private startPendingCanvasMutationFlusher;
+    private startRAFTimestamping;
+    flushPendingCanvasMutations(): void;
+    flushPendingCanvasMutationFor(canvas: HTMLCanvasElement, id: number): void;
+}

package/dist/record/observers/canvas/serialize-args.d.ts

@@ -1,5 +1,6 @@
 import { IWindow, SerializedWebGlArg } from '../../../types';
-export declare function serializeArg(value: any, win: IWindow): SerializedWebGlArg;
-export declare const serializeArgs: (args: Array<any>, win: IWindow) => SerializedWebGlArg[];
+export declare function variableListFor(ctx: WebGLRenderingContext | WebGL2RenderingContext, ctor: string): any[];
+export declare const saveWebGLVar: (value: any, win: IWindow, ctx: WebGL2RenderingContext | WebGLRenderingContext) => number | void;
+export declare function serializeArg(value: any, win: IWindow, ctx: WebGL2RenderingContext | WebGLRenderingContext): SerializedWebGlArg;
+export declare const serializeArgs: (args: Array<any>, win: IWindow, ctx: WebGLRenderingContext | WebGL2RenderingContext) => SerializedWebGlArg[];
 export declare const isInstanceOfWebGLObject: (value: any, win: IWindow) => value is WebGLShader | WebGLProgram | WebGLActiveInfo | WebGLBuffer | WebGLFramebuffer | WebGLRenderbuffer | WebGLShaderPrecisionFormat | WebGLTexture | WebGLUniformLocation | WebGLVertexArrayObject;
-export declare const saveWebGLVar: (value: any, win: IWindow) => number | void;

package/dist/record/observers/canvas/webgl.d.ts

@@ -1,2 +1,2 @@
-import { blockClass, canvasMutationCallback, IWindow, listenerHandler, Mirror } from '../../../types';
-export default function initCanvasWebGLMutationObserver(cb: canvasMutationCallback, win: IWindow, blockClass: blockClass, mirror: Mirror): listenerHandler;
+import { blockClass, canvasManagerMutationCallback, IWindow, listenerHandler, Mirror } from '../../../types';
+export default function initCanvasWebGLMutationObserver(cb: canvasManagerMutationCallback, win: IWindow, blockClass: blockClass, mirror: Mirror): listenerHandler;

package/dist/record/shadow-dom-manager.d.ts

@@ -1,6 +1,7 @@
 import { mutationCallBack, blockClass, maskTextClass, Mirror, scrollCallback, SamplingStrategy } from '../types';
 import { MaskInputOptions, SlimDOMOptions, MaskTextFn, MaskInputFn } from '../snapshot';
 import { IframeManager } from './iframe-manager';
+import { CanvasManager } from './observers/canvas/canvas-manager';
 declare type BypassOptions = {
     blockClass: blockClass;
     blockSelector: string | null;
@@ -14,6 +15,7 @@ declare type BypassOptions = {
     sampling: SamplingStrategy;
     slimDOMOptions: SlimDOMOptions;
     iframeManager: IframeManager;
+    canvasManager: CanvasManager;
     enableStrictPrivacy: boolean;
 };
 export declare class ShadowDomManager {

package/dist/replay/canvas/2d.d.ts

@@ -1,8 +1,8 @@
 import { Replayer } from '../';
-import { canvasMutationData } from '../../types';
+import { canvasMutationCommand } from '../../types';
 export default function canvasMutation({ event, mutation, target, imageMap, errorHandler, }: {
     event: Parameters<Replayer['applyIncremental']>[0];
-    mutation: canvasMutationData;
+    mutation: canvasMutationCommand;
     target: HTMLCanvasElement;
     imageMap: Replayer['imageMap'];
     errorHandler: Replayer['warnCanvasMutationFailed'];

package/dist/replay/canvas/webgl.d.ts

@@ -1,10 +1,11 @@
 import { Replayer } from '../';
-import { canvasMutationData, SerializedWebGlArg } from '../../types';
-export declare function variableListFor(ctor: string): any[];
-export declare function deserializeArg(imageMap: Replayer['imageMap']): (arg: SerializedWebGlArg) => any;
-export default function webglMutation({ mutation, target, imageMap, errorHandler, }: {
-    mutation: canvasMutationData;
+import { CanvasContext, canvasMutationCommand, SerializedWebGlArg } from '../../types';
+export declare function variableListFor(ctx: WebGLRenderingContext | WebGL2RenderingContext, ctor: string): any[];
+export declare function deserializeArg(imageMap: Replayer['imageMap'], ctx: WebGLRenderingContext | WebGL2RenderingContext): (arg: SerializedWebGlArg) => any;
+export default function webglMutation({ mutation, target, type, imageMap, errorHandler, }: {
+    mutation: canvasMutationCommand;
     target: HTMLCanvasElement;
+    type: CanvasContext;
     imageMap: Replayer['imageMap'];
     errorHandler: Replayer['warnCanvasMutationFailed'];
 }): void;

package/dist/replay/index.d.ts

@@ -58,6 +58,7 @@ export declare class Replayer {
     private hasImageArg;
     private getImageArgs;
     private preloadAllImages;
+    private preloadImages;
     private applyIncremental;
     private applyMutation;
     private applyScroll;

package/dist/replay/timer.d.ts

@@ -15,7 +15,4 @@ export declare class Timer {
     isActive(): boolean;
     private findActionIndex;
 }
-export declare type LastDelay = {
-    at: number | null;
-};
-export declare function addDelay(event: eventWithTime, baselineTime: number, lastDelay?: LastDelay): number;
+export declare function addDelay(event: eventWithTime, baselineTime: number): number;

package/dist/snapshot/utils.d.ts

@@ -8,3 +8,4 @@ export declare function maskInputValue({ maskInputOptions, tagName, type, value,
     value: string | null;
     maskInputFn?: MaskInputFn;
 }): string;
+export declare function is2DCanvasBlank(canvas: HTMLCanvasElement): boolean;

package/dist/types.d.ts

@@ -4,6 +4,7 @@ import { FontFaceDescriptors } from 'css-font-loading-module';
 import { IframeManager } from './record/iframe-manager';
 import { ShadowDomManager } from './record/shadow-dom-manager';
 import type { Replayer } from './replay';
+import { CanvasManager } from './record/observers/canvas/canvas-manager';
 export declare enum EventType {
     DomContentLoaded = 0,
     Load = 1,
@@ -128,11 +129,12 @@ export declare type SamplingStrategy = Partial<{
     mousemoveCallback: number;
     mouseInteraction: boolean | Record<string, boolean | undefined>;
     scroll: number;
+    media: number;
     input: 'all' | 'last';
 }>;
 export declare type RecordPlugin<TOptions = unknown> = {
     name: string;
-    observer: (cb: Function, win: Window, options: TOptions) => listenerHandler;
+    observer: (cb: Function, win: IWindow, options: TOptions) => listenerHandler;
     options: TOptions;
 };
 export declare type recordOptions<T> = {
@@ -191,6 +193,7 @@ export declare type observerParam = {
     mirror: Mirror;
     iframeManager: IframeManager;
     shadowDomManager: ShadowDomManager;
+    canvasManager: CanvasManager;
     plugins: Array<{
         observer: Function;
         callback: Function;
@@ -345,15 +348,24 @@ export declare type styleDeclarationParam = {
     };
 };
 export declare type styleDeclarationCallback = (s: styleDeclarationParam) => void;
-export declare type canvasMutationCallback = (p: canvasMutationParam) => void;
-export declare type canvasMutationParam = {
-    id: number;
-    type: CanvasContext;
+export declare type canvasMutationCommand = {
     property: string;
     args: Array<unknown>;
     setter?: true;
-    newFrame?: true;
 };
+export declare type canvasMutationParam = {
+    id: number;
+    type: CanvasContext;
+    commands: canvasMutationCommand[];
+} | ({
+    id: number;
+    type: CanvasContext;
+} & canvasMutationCommand);
+export declare type canvasMutationWithType = {
+    type: CanvasContext;
+} & canvasMutationCommand;
+export declare type canvasMutationCallback = (p: canvasMutationParam) => void;
+export declare type canvasManagerMutationCallback = (target: HTMLCanvasElement, p: canvasMutationWithType) => void;
 export declare type fontParam = {
     family: string;
     fontSource: string;
@@ -377,12 +389,15 @@ export declare type inputCallback = (v: inputValue & {
 export declare const enum MediaInteractions {
     Play = 0,
     Pause = 1,
-    Seeked = 2
+    Seeked = 2,
+    VolumeChange = 3
 }
 export declare type mediaInteractionParam = {
     type: MediaInteractions;
     id: number;
     currentTime?: number;
+    volume?: number;
+    muted?: boolean;
 };
 export declare type mediaInteractionCallback = (p: mediaInteractionParam) => void;
 export declare type DocumentDimension = {
@@ -450,7 +465,6 @@ export declare type missingNodeMap = {
 export declare type actionWithDelay = {
     doAction: () => void;
     delay: number;
-    newFrame: boolean;
 };
 export declare type Handler = (event?: unknown) => void;
 export declare type Emitter = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@highlight-run/rrweb",
-  "version": "1.1.3",
+  "version": "1.1.7",
   "description": "record and replay the web",
   "scripts": {
     "test": "npm run bundle:browser && cross-env TS_NODE_CACHE=false TS_NODE_FILES=true mocha -r ts-node/register -r ignore-styles -r jsdom-global/register test/**.test.ts",