From 329de4e9f789ceb373ae711363dceb0e3a86d0e5 Mon Sep 17 00:00:00 2001 From: yz-yu Date: Wed, 1 Apr 2026 12:00:00 +0800 Subject: [PATCH] update dependencies and generate typings (#44) --- .release-it.json | 2 +- package.json | 11 +- test/integration.test.ts | 6 +- typings/index.d.ts | 4 + typings/record/index.d.ts | 3 + typings/record/observer.d.ts | 2 + typings/replay/index.d.ts | 37 +++++ typings/replay/styles/inject-style.d.ts | 2 + typings/replay/timer.d.ts | 13 ++ typings/types.d.ts | 201 ++++++++++++++++++++++++ typings/utils.d.ts | 8 + 11 files changed, 278 insertions(+), 11 deletions(-) create mode 100644 typings/index.d.ts create mode 100644 typings/record/index.d.ts create mode 100644 typings/record/observer.d.ts create mode 100644 typings/replay/index.d.ts create mode 100644 typings/replay/styles/inject-style.d.ts create mode 100644 typings/replay/timer.d.ts create mode 100644 typings/types.d.ts create mode 100644 typings/utils.d.ts diff --git a/.release-it.json b/.release-it.json index 4aff1037..15b39fa3 100644 --- a/.release-it.json +++ b/.release-it.json @@ -1,4 +1,4 @@ { "non-interactive": true, - "buildCommand": "npm run bundle" + "buildCommand": "npm run bundle && npm run typings" } diff --git a/package.json b/package.json index 72778a7d..11946271 100644 --- a/package.json +++ b/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", diff --git a/test/integration.test.ts b/test/integration.test.ts index 6849572d..1a4c86b7 100644 --- a/test/integration.test.ts +++ b/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', }); diff --git a/typings/index.d.ts b/typings/index.d.ts new file mode 100644 index 00000000..79016389 --- /dev/null +++ b/typings/index.d.ts @@ -0,0 +1,4 @@ +import record from './record'; +import { Replayer } from './replay'; +import { mirror } from './utils'; +export { record, Replayer, mirror }; diff --git a/typings/record/index.d.ts b/typings/record/index.d.ts new file mode 100644 index 00000000..3dbb11b5 --- /dev/null +++ b/typings/record/index.d.ts @@ -0,0 +1,3 @@ +import { recordOptions, listenerHandler } from '../types'; +declare function record(options?: recordOptions): listenerHandler | undefined; +export default record; diff --git a/typings/record/observer.d.ts b/typings/record/observer.d.ts new file mode 100644 index 00000000..068a08f1 --- /dev/null +++ b/typings/record/observer.d.ts @@ -0,0 +1,2 @@ +import { observerParam, listenerHandler } from '../types'; +export default function initObservers(o: observerParam): listenerHandler; diff --git a/typings/replay/index.d.ts b/typings/replay/index.d.ts new file mode 100644 index 00000000..f81387df --- /dev/null +++ b/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); + on(event: string, handler: mitt.Handler): void; + setConfig(config: Partial): 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; +} diff --git a/typings/replay/styles/inject-style.d.ts b/typings/replay/styles/inject-style.d.ts new file mode 100644 index 00000000..0798d9e7 --- /dev/null +++ b/typings/replay/styles/inject-style.d.ts @@ -0,0 +1,2 @@ +declare const rules: string[]; +export default rules; diff --git a/typings/replay/timer.d.ts b/typings/replay/timer.d.ts new file mode 100644 index 00000000..8a27af7c --- /dev/null +++ b/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; +} diff --git a/typings/types.d.ts b/typings/types.d.ts new file mode 100644 index 00000000..4c4fa21f --- /dev/null +++ b/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 {}; diff --git a/typings/utils.d.ts b/typings/utils.d.ts new file mode 100644 index 00000000..9262328a --- /dev/null +++ b/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(func: (arg: T) => void, wait: number, options?: throttleOptions): () => void; +export declare function hookSetter(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;