update dependencies and generate typings (#44)

.release-it.json

@@ -1,4 +1,4 @@
 {
   "non-interactive": true,
-  "buildCommand": "npm run bundle"
+  "buildCommand": "npm run bundle && npm run typings"
 }

package.json

@@ -6,7 +6,8 @@
     "test": "npm run bundle:browser && cross-env TS_NODE_CACHE=false TS_NODE_FILES=true mocha -r ts-node/register test/**/*.test.ts",
     "repl": "npm run bundle:browser && cross-env TS_NODE_CACHE=false TS_NODE_FILES=true ts-node scripts/repl.ts",
     "bundle:browser": "cross-env BROWSER_ONLY=true rollup --config",
-    "bundle": "rollup --config"
+    "bundle": "rollup --config",
+    "typings": "tsc -d --declarationDir typings"
   },
   "repository": {
     "type": "git",
@@ -18,7 +19,7 @@
   "main": "lib/rrweb.js",
   "module": "es/rrweb.js",
   "unpkg": "dist/rrweb.js",
-  "typings": "./index.d.ts",
+  "typings": "typings/index.d.ts",
   "files": [
     "dist",
     "lib",
@@ -37,13 +38,13 @@
     "@types/inquirer": "0.0.43",
     "@types/mocha": "^5.2.5",
     "@types/node": "^10.11.7",
-    "@types/puppeteer": "^1.9.0",
+    "@types/puppeteer": "^1.11.1",
     "chai": "^4.2.0",
     "cross-env": "^5.2.0",
     "inquirer": "^6.2.1",
     "jest-snapshot": "^23.6.0",
     "mocha": "^5.2.0",
-    "puppeteer": "^1.9.0",
+    "puppeteer": "^1.11.0",
     "rollup": "^0.66.6",
     "rollup-plugin-commonjs": "^9.2.0",
     "rollup-plugin-node-resolve": "^3.4.0",
@@ -53,7 +54,7 @@
     "ts-node": "^7.0.1",
     "tslib": "^1.9.3",
     "tslint": "^4.5.1",
-    "typescript": "^3.1.6"
+    "typescript": "^3.2.4"
   },
   "dependencies": {
     "@types/smoothscroll-polyfill": "^0.3.0",

test/integration.test.ts

@@ -118,11 +118,7 @@ describe('record integration tests', () => {
   it('can record node mutations', async () => {
     const page: puppeteer.Page = await this.browser.newPage();
     await page.goto('about:blank');
-    // FIXME: use setContent directly when @types/puppeteer update
-    const setContent = async (html: string, options: any) => {
-      return page.setContent.call(page, html, options);
-    };
-    await setContent(getHtml.call(this, 'select2.html'), {
+    await page.setContent(getHtml.call(this, 'select2.html'), {
       waitUntil: 'networkidle0',
     });
 

typings/index.d.ts

@@ -0,0 +1,4 @@
+import record from './record';
+import { Replayer } from './replay';
+import { mirror } from './utils';
+export { record, Replayer, mirror };

typings/record/index.d.ts

@@ -0,0 +1,3 @@
+import { recordOptions, listenerHandler } from '../types';
+declare function record(options?: recordOptions): listenerHandler | undefined;
+export default record;

typings/record/observer.d.ts

@@ -0,0 +1,2 @@
+import { observerParam, listenerHandler } from '../types';
+export default function initObservers(o: observerParam): listenerHandler;

typings/replay/index.d.ts

@@ -0,0 +1,37 @@
+import Timer from './timer';
+import { eventWithTime, playerConfig, playerMetaData } from '../types';
+import './styles/style.css';
+export declare class Replayer {
+    wrapper: HTMLDivElement;
+    iframe: HTMLIFrameElement;
+    timer: Timer;
+    private events;
+    private config;
+    private mouse;
+    private emitter;
+    private baselineTime;
+    private lastPlayedEvent;
+    private nextUserInteractionEvent;
+    private noramlSpeed;
+    private missingNodeRetryMap;
+    constructor(events: eventWithTime[], config?: Partial<playerConfig>);
+    on(event: string, handler: mitt.Handler): void;
+    setConfig(config: Partial<playerConfig>): void;
+    getMetaData(): playerMetaData;
+    getTimeOffset(): number;
+    play(timeOffset?: number): void;
+    pause(): void;
+    resume(timeOffset?: number): void;
+    private setupDom;
+    private handleResize;
+    private getDelay;
+    private getCastFn;
+    private rebuildFullSnapshot;
+    private waitForStylesheetLoad;
+    private applyIncremental;
+    private resolveMissingNode;
+    private hoverElements;
+    private isUserInteraction;
+    private restoreSpeed;
+    private warnNodeNotFound;
+}

typings/replay/styles/inject-style.d.ts

@@ -0,0 +1,2 @@
+declare const rules: string[];
+export default rules;

typings/replay/timer.d.ts

@@ -0,0 +1,13 @@
+import { playerConfig, actionWithDelay } from '../types';
+export default class Timer {
+    timeOffset: number;
+    private actions;
+    private config;
+    private raf;
+    constructor(config: playerConfig, actions?: actionWithDelay[]);
+    addAction(action: actionWithDelay): void;
+    addActions(actions: actionWithDelay[]): void;
+    start(): void;
+    clear(): void;
+    private findActionIndex;
+}

typings/types.d.ts

@@ -0,0 +1,201 @@
+import { serializedNodeWithId, idNodeMap, INode } from 'rrweb-snapshot';
+export declare enum EventType {
+    DomContentLoaded = 0,
+    Load = 1,
+    FullSnapshot = 2,
+    IncrementalSnapshot = 3,
+    Meta = 4
+}
+export declare type domContentLoadedEvent = {
+    type: EventType.DomContentLoaded;
+    data: {};
+};
+export declare type loadedEvent = {
+    type: EventType.Load;
+    data: {};
+};
+export declare type fullSnapshotEvent = {
+    type: EventType.FullSnapshot;
+    data: {
+        node: serializedNodeWithId;
+        initialOffset: {
+            top: number;
+            left: number;
+        };
+    };
+};
+export declare type incrementalSnapshotEvent = {
+    type: EventType.IncrementalSnapshot;
+    data: incrementalData;
+};
+export declare type metaEvent = {
+    type: EventType.Meta;
+    data: {
+        href: string;
+        width: number;
+        height: number;
+    };
+};
+export declare enum IncrementalSource {
+    Mutation = 0,
+    MouseMove = 1,
+    MouseInteraction = 2,
+    Scroll = 3,
+    ViewportResize = 4,
+    Input = 5
+}
+export declare type mutationData = {
+    source: IncrementalSource.Mutation;
+} & mutationCallbackParam;
+export declare type mousemoveData = {
+    source: IncrementalSource.MouseMove;
+    positions: mousePosition[];
+};
+export declare type mouseInteractionData = {
+    source: IncrementalSource.MouseInteraction;
+} & mouseInteractionParam;
+export declare type scrollData = {
+    source: IncrementalSource.Scroll;
+} & scrollPosition;
+export declare type viewportResizeData = {
+    source: IncrementalSource.ViewportResize;
+} & viewportResizeDimention;
+export declare type inputData = {
+    source: IncrementalSource.Input;
+    id: number;
+} & inputValue;
+export declare type incrementalData = mutationData | mousemoveData | mouseInteractionData | scrollData | viewportResizeData | inputData;
+export declare type event = domContentLoadedEvent | loadedEvent | fullSnapshotEvent | incrementalSnapshotEvent | metaEvent;
+export declare type eventWithTime = event & {
+    timestamp: number;
+    delay?: number;
+};
+export declare type recordOptions = {
+    emit?: (e: eventWithTime, isCheckout?: boolean) => void;
+    checkoutEveryNth?: number;
+    checkoutEveryNms?: number;
+};
+export declare type observerParam = {
+    mutationCb: mutationCallBack;
+    mousemoveCb: mousemoveCallBack;
+    mouseInteractionCb: mouseInteractionCallBack;
+    scrollCb: scrollCallback;
+    viewportResizeCb: viewportResizeCallback;
+    inputCb: inputCallback;
+};
+export declare type textCursor = {
+    node: Node;
+    value: string | null;
+};
+export declare type textMutation = {
+    id: number;
+    value: string | null;
+};
+export declare type attributeCursor = {
+    node: Node;
+    attributes: {
+        [key: string]: string | null;
+    };
+};
+export declare type attributeMutation = {
+    id: number;
+    attributes: {
+        [key: string]: string | null;
+    };
+};
+export declare type removedNodeMutation = {
+    parentId: number;
+    id: number;
+};
+export declare type addedNodeMutation = {
+    parentId: number;
+    previousId: number | null;
+    nextId: number | null;
+    node: serializedNodeWithId;
+};
+declare type mutationCallbackParam = {
+    texts: textMutation[];
+    attributes: attributeMutation[];
+    removes: removedNodeMutation[];
+    adds: addedNodeMutation[];
+};
+export declare type mutationCallBack = (m: mutationCallbackParam) => void;
+export declare type mousemoveCallBack = (p: mousePosition[]) => void;
+export declare type mousePosition = {
+    x: number;
+    y: number;
+    id: number;
+    timeOffset: number;
+};
+export declare enum MouseInteractions {
+    MouseUp = 0,
+    MouseDown = 1,
+    Click = 2,
+    ContextMenu = 3,
+    DblClick = 4,
+    Focus = 5,
+    Blur = 6,
+    TouchStart = 7,
+    TouchMove = 8,
+    TouchEnd = 9
+}
+declare type mouseInteractionParam = {
+    type: MouseInteractions;
+    id: number;
+    x: number;
+    y: number;
+};
+export declare type mouseInteractionCallBack = (d: mouseInteractionParam) => void;
+export declare type scrollPosition = {
+    id: number;
+    x: number;
+    y: number;
+};
+export declare type scrollCallback = (p: scrollPosition) => void;
+export declare type viewportResizeDimention = {
+    width: number;
+    height: number;
+};
+export declare type viewportResizeCallback = (d: viewportResizeDimention) => void;
+export declare type inputValue = {
+    text: string;
+    isChecked: boolean;
+};
+export declare type inputCallback = (v: inputValue & {
+    id: number;
+}) => void;
+export declare type Mirror = {
+    map: idNodeMap;
+    getId: (n: INode) => number;
+    getNode: (id: number) => INode | null;
+    removeNodeFromMap: (n: INode) => void;
+    has: (id: number) => boolean;
+};
+export declare type throttleOptions = {
+    leading?: boolean;
+    trailing?: boolean;
+};
+export declare type listenerHandler = () => void;
+export declare type hookResetter = () => void;
+export declare type playerConfig = {
+    speed: number;
+    root: Element;
+    loadTimeout: number;
+    skipInactive: Boolean;
+    showWarning: Boolean;
+};
+export declare type playerMetaData = {
+    totalTime: number;
+};
+export declare type missingNode = {
+    node: Node;
+    mutation: addedNodeMutation;
+};
+export declare type missingNodeMap = {
+    [id: number]: missingNode;
+};
+export declare type actionWithDelay = {
+    doAction: () => void;
+    delay: number;
+};
+export {};

typings/utils.d.ts

@@ -0,0 +1,8 @@
+import { Mirror, throttleOptions, listenerHandler, hookResetter } from './types';
+export declare function on(type: string, fn: EventListenerOrEventListenerObject, target?: Document | Window): listenerHandler;
+export declare const mirror: Mirror;
+export declare function throttle<T>(func: (arg: T) => void, wait: number, options?: throttleOptions): () => void;
+export declare function hookSetter<T>(target: T, key: string | number | symbol, d: PropertyDescriptor): hookResetter;
+export declare function getWindowHeight(): number;
+export declare function getWindowWidth(): number;
+export declare function isBlocked(node: Node | null): boolean;