From 5a789385a341311ba327a768fe0e2f0f2f5002ee Mon Sep 17 00:00:00 2001 From: David Newell Date: Fri, 6 Dec 2024 13:17:24 +0000 Subject: [PATCH] chore: abstract types to shared package (#1593) * chore: update types * small typing change * fix typing issue * typed node * add extra lint skip * add changeset --------- Co-authored-by: Eoghan Murray Co-authored-by: Justin Halsall --- .changeset/soft-worms-tan.md | 11 ++ packages/all/test/utils.ts | 2 +- .../src/index.ts | 9 +- packages/rrdom-nodejs/package.json | 2 +- packages/rrdom-nodejs/src/document-nodejs.ts | 5 +- .../rrdom-nodejs/test/document-nodejs.test.ts | 2 +- packages/rrdom-nodejs/tsconfig.json | 2 +- packages/rrdom/src/diff.ts | 8 +- packages/rrdom/src/document.ts | 2 +- packages/rrdom/src/index.ts | 10 +- packages/rrdom/test/diff.test.ts | 19 ++- packages/rrdom/test/diff/dialog.test.ts | 2 +- packages/rrdom/test/document.test.ts | 2 +- packages/rrdom/test/virtual-dom.test.ts | 5 +- packages/rrweb-snapshot/package.json | 1 + packages/rrweb-snapshot/src/rebuild.ts | 8 +- packages/rrweb-snapshot/src/snapshot.ts | 34 ++-- packages/rrweb-snapshot/src/types.ts | 151 +---------------- packages/rrweb-snapshot/src/utils.ts | 7 +- packages/rrweb-snapshot/test/css.test.ts | 10 +- packages/rrweb-snapshot/test/rebuild.test.ts | 2 +- packages/rrweb-snapshot/test/utils.test.ts | 4 +- packages/rrweb-snapshot/tsconfig.json | 3 + packages/rrweb/src/record/iframe-manager.ts | 7 +- .../record/observers/canvas/canvas-manager.ts | 3 +- .../rrweb/src/record/stylesheet-manager.ts | 3 +- .../workers/image-bitmap-data-url-worker.ts | 2 +- packages/rrweb/src/replay/index.ts | 6 +- packages/rrweb/src/replay/media/index.ts | 7 +- packages/rrweb/src/types.ts | 2 +- packages/rrweb/src/utils.ts | 3 +- packages/rrweb/test/integration.test.ts | 4 +- packages/rrweb/test/utils.ts | 2 +- packages/types/package.json | 3 - packages/types/src/index.ts | 157 +++++++++++++++++- packages/types/tsconfig.json | 6 +- 36 files changed, 256 insertions(+), 250 deletions(-) create mode 100644 .changeset/soft-worms-tan.md diff --git a/.changeset/soft-worms-tan.md b/.changeset/soft-worms-tan.md new file mode 100644 index 0000000000..b6c415e0ca --- /dev/null +++ b/.changeset/soft-worms-tan.md @@ -0,0 +1,11 @@ +--- +"@rrweb/all": patch +"rrdom-nodejs": patch +"rrdom": patch +"rrweb-snapshot": major +"rrweb": patch +"@rrweb/rrweb-plugin-canvas-webrtc-record": patch +--- + +`NodeType` enum was moved from rrweb-snapshot to @rrweb/types +The following types where moved from rrweb-snapshot to @rrweb/types: `documentNode`, `documentTypeNode`, `legacyAttributes`, `textNode`, `cdataNode`, `commentNode`, `elementNode`, `serializedNode`, `serializedNodeWithId`, `serializedElementNodeWithId`, `serializedTextNodeWithId`, `IMirror`, `INode`, `mediaAttributes`, `attributes` and `DataURLOptions` diff --git a/packages/all/test/utils.ts b/packages/all/test/utils.ts index 5f8aaab932..7947be917b 100644 --- a/packages/all/test/utils.ts +++ b/packages/all/test/utils.ts @@ -1,6 +1,6 @@ -import { NodeType } from 'rrweb-snapshot'; import { expect } from 'vitest'; import { + NodeType, EventType, IncrementalSource, eventWithTime, diff --git a/packages/plugins/rrweb-plugin-canvas-webrtc-record/src/index.ts b/packages/plugins/rrweb-plugin-canvas-webrtc-record/src/index.ts index 4bb8f8f65a..6390468e08 100644 --- a/packages/plugins/rrweb-plugin-canvas-webrtc-record/src/index.ts +++ b/packages/plugins/rrweb-plugin-canvas-webrtc-record/src/index.ts @@ -1,6 +1,9 @@ -import type { Mirror } from 'rrweb-snapshot'; import SimplePeer from 'simple-peer-light'; -import type { RecordPlugin, ICrossOriginIframeMirror } from '@rrweb/types'; +import type { + RecordPlugin, + ICrossOriginIframeMirror, + IMirror, +} from '@rrweb/types'; import type { WebRTCDataChannel } from './types'; export const PLUGIN_NAME = 'rrweb/canvas-webrtc@1'; @@ -25,7 +28,7 @@ export type CrossOriginIframeMessageEventContent = { export class RRWebPluginCanvasWebRTCRecord { private peer: SimplePeer.Instance | null = null; - private mirror: Mirror | undefined; + private mirror: IMirror | undefined; private crossOriginIframeMirror: ICrossOriginIframeMirror | undefined; private streamMap: Map = new Map(); private incomingStreams = new Set(); diff --git a/packages/rrdom-nodejs/package.json b/packages/rrdom-nodejs/package.json index 5663078dd3..4495b7bcf3 100644 --- a/packages/rrdom-nodejs/package.json +++ b/packages/rrdom-nodejs/package.json @@ -56,6 +56,6 @@ "cssstyle": "^2.3.0", "nwsapi": "2.2.0", "rrdom": "^2.0.0-alpha.17", - "rrweb-snapshot": "^2.0.0-alpha.17" + "@rrweb/types": "^2.0.0-alpha.17" } } diff --git a/packages/rrdom-nodejs/src/document-nodejs.ts b/packages/rrdom-nodejs/src/document-nodejs.ts index b9bba9846d..dd36784db3 100644 --- a/packages/rrdom-nodejs/src/document-nodejs.ts +++ b/packages/rrdom-nodejs/src/document-nodejs.ts @@ -1,5 +1,4 @@ -/* eslint-disable @typescript-eslint/no-unsafe-assignment */ -import { NodeType as RRNodeType } from 'rrweb-snapshot'; +import { NodeType as RRNodeType } from '@rrweb/types'; import type { NWSAPI } from 'nwsapi'; import type { CSSStyleDeclaration as CSSStyleDeclarationType } from 'cssstyle'; import { @@ -345,7 +344,7 @@ export class RRStyleElement extends RRElement { for (const child of this.childNodes) if (child.RRNodeType === RRNodeType.Text) result += (child as RRText).textContent; - // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call + // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-assignment this._sheet = cssom.parse(result); } return this._sheet; diff --git a/packages/rrdom-nodejs/test/document-nodejs.test.ts b/packages/rrdom-nodejs/test/document-nodejs.test.ts index b6be55bc0f..9ad203dcc8 100644 --- a/packages/rrdom-nodejs/test/document-nodejs.test.ts +++ b/packages/rrdom-nodejs/test/document-nodejs.test.ts @@ -4,7 +4,7 @@ import { describe, it, expect, beforeAll } from 'vitest'; import * as fs from 'fs'; import * as path from 'path'; -import { NodeType as RRNodeType } from 'rrweb-snapshot'; +import { NodeType as RRNodeType } from '@rrweb/types'; import { RRCanvasElement, RRCDATASection, diff --git a/packages/rrdom-nodejs/tsconfig.json b/packages/rrdom-nodejs/tsconfig.json index 4da375e447..8f1d20380a 100644 --- a/packages/rrdom-nodejs/tsconfig.json +++ b/packages/rrdom-nodejs/tsconfig.json @@ -10,7 +10,7 @@ "path": "../rrdom" }, { - "path": "../rrweb-snapshot" + "path": "../types" } ] } diff --git a/packages/rrdom/src/diff.ts b/packages/rrdom/src/diff.ts index 5cff5dc724..5d9ba7cea5 100644 --- a/packages/rrdom/src/diff.ts +++ b/packages/rrdom/src/diff.ts @@ -1,11 +1,9 @@ -import { - NodeType as RRNodeType, - Mirror as NodeMirror, - type elementNode, -} from 'rrweb-snapshot'; +import { type Mirror as NodeMirror } from 'rrweb-snapshot'; +import { NodeType as RRNodeType } from '@rrweb/types'; import type { canvasMutationData, canvasEventWithTime, + elementNode, inputData, scrollData, styleDeclarationData, diff --git a/packages/rrdom/src/document.ts b/packages/rrdom/src/document.ts index f3f55aec1a..344dd44112 100644 --- a/packages/rrdom/src/document.ts +++ b/packages/rrdom/src/document.ts @@ -1,4 +1,4 @@ -import { NodeType as RRNodeType } from 'rrweb-snapshot'; +import { NodeType as RRNodeType } from '@rrweb/types'; import { parseCSSText, camelize, toCSSText } from './style'; export interface IRRNode { parentElement: IRRNode | null; diff --git a/packages/rrdom/src/index.ts b/packages/rrdom/src/index.ts index 577811766b..e5984e580a 100644 --- a/packages/rrdom/src/index.ts +++ b/packages/rrdom/src/index.ts @@ -1,13 +1,9 @@ -import { - NodeType as RRNodeType, - createMirror as createNodeMirror, -} from 'rrweb-snapshot'; +import { createMirror as createNodeMirror } from 'rrweb-snapshot'; +import type { Mirror as NodeMirror } from 'rrweb-snapshot'; +import { NodeType as RRNodeType } from '@rrweb/types'; import type { - Mirror as NodeMirror, IMirror, serializedNodeWithId, -} from 'rrweb-snapshot'; -import type { canvasMutationData, canvasEventWithTime, inputData, diff --git a/packages/rrdom/test/diff.test.ts b/packages/rrdom/test/diff.test.ts index e250ef8f06..bcd42ffa44 100644 --- a/packages/rrdom/test/diff.test.ts +++ b/packages/rrdom/test/diff.test.ts @@ -5,12 +5,7 @@ import * as fs from 'fs'; import * as path from 'path'; import * as puppeteer from 'puppeteer'; import { vi, MockInstance } from 'vitest'; -import { - NodeType as RRNodeType, - createMirror, - Mirror as NodeMirror, - serializedNodeWithId, -} from 'rrweb-snapshot'; +import { createMirror, Mirror as NodeMirror } from 'rrweb-snapshot'; import { buildFromDom, getDefaultSN, @@ -27,8 +22,16 @@ import { sameNodeType, } from '../src/diff'; import type { IRRElement, IRRNode } from '../src/document'; -import type { canvasMutationData, styleSheetRuleData } from '@rrweb/types'; -import { EventType, IncrementalSource } from '@rrweb/types'; +import type { + serializedNodeWithId, + canvasMutationData, + styleSheetRuleData, +} from '@rrweb/types'; +import { + NodeType as RRNodeType, + EventType, + IncrementalSource, +} from '@rrweb/types'; const elementSn = { type: RRNodeType.Element, diff --git a/packages/rrdom/test/diff/dialog.test.ts b/packages/rrdom/test/diff/dialog.test.ts index 11a80e6ec5..623fa826b0 100644 --- a/packages/rrdom/test/diff/dialog.test.ts +++ b/packages/rrdom/test/diff/dialog.test.ts @@ -3,11 +3,11 @@ */ import { vi, MockInstance } from 'vitest'; import { - NodeType as RRNodeType, createMirror, Mirror as NodeMirror, serializedNodeWithId, } from 'rrweb-snapshot'; +import { NodeType as RRNodeType } from '@rrweb/types'; import { RRDocument } from '../../src'; import { diff, ReplayerHandler } from '../../src/diff'; diff --git a/packages/rrdom/test/document.test.ts b/packages/rrdom/test/document.test.ts index fb43b0f6ab..80661b7daa 100644 --- a/packages/rrdom/test/document.test.ts +++ b/packages/rrdom/test/document.test.ts @@ -1,7 +1,7 @@ /** * @jest-environment jsdom */ -import { NodeType as RRNodeType } from 'rrweb-snapshot'; +import { NodeType as RRNodeType } from '@rrweb/types'; import { BaseRRDocument, BaseRRDocumentType, diff --git a/packages/rrdom/test/virtual-dom.test.ts b/packages/rrdom/test/virtual-dom.test.ts index 8896e81d41..9740cc7c1a 100644 --- a/packages/rrdom/test/virtual-dom.test.ts +++ b/packages/rrdom/test/virtual-dom.test.ts @@ -6,18 +6,17 @@ import * as path from 'path'; import * as puppeteer from 'puppeteer'; import { vi } from 'vitest'; import { JSDOM } from 'jsdom'; +import { buildNodeWithSN, Mirror } from 'rrweb-snapshot'; import { - buildNodeWithSN, cdataNode, commentNode, documentNode, documentTypeNode, elementNode, - Mirror, NodeType, NodeType as RRNodeType, textNode, -} from 'rrweb-snapshot'; +} from '@rrweb/types'; import { buildFromDom, buildFromNode, diff --git a/packages/rrweb-snapshot/package.json b/packages/rrweb-snapshot/package.json index 70d5a104a0..755d317bdd 100644 --- a/packages/rrweb-snapshot/package.json +++ b/packages/rrweb-snapshot/package.json @@ -54,6 +54,7 @@ }, "homepage": "https://github.com/rrweb-io/rrweb/tree/master/packages/rrweb-snapshot#readme", "devDependencies": { + "@rrweb/types": "^2.0.0-alpha.17", "@rrweb/utils": "^2.0.0-alpha.17", "@types/jsdom": "^20.0.0", "@types/node": "^18.15.11", diff --git a/packages/rrweb-snapshot/src/rebuild.ts b/packages/rrweb-snapshot/src/rebuild.ts index e4a4c9df4f..f83ac0bc0b 100644 --- a/packages/rrweb-snapshot/src/rebuild.ts +++ b/packages/rrweb-snapshot/src/rebuild.ts @@ -2,13 +2,11 @@ import { mediaSelectorPlugin, pseudoClassPlugin } from './css'; import { type serializedNodeWithId, type serializedElementNodeWithId, - type serializedTextNodeWithId, NodeType, - type tagMap, type elementNode, - type BuildCache, type legacyAttributes, -} from './types'; +} from '@rrweb/types'; +import { type tagMap, type BuildCache } from './types'; import { isElement, Mirror, isNodeMetaEqual } from './utils'; import postcss from 'postcss'; @@ -90,7 +88,7 @@ export function applyCssSplits( hackCss: boolean, cache: BuildCache, ): void { - const childTextNodes: serializedTextNodeWithId[] = []; + const childTextNodes = []; for (const scn of n.childNodes) { if (scn.type === NodeType.Text) { childTextNodes.push(scn); diff --git a/packages/rrweb-snapshot/src/snapshot.ts b/packages/rrweb-snapshot/src/snapshot.ts index cd3d7189b7..0e8ec68be9 100644 --- a/packages/rrweb-snapshot/src/snapshot.ts +++ b/packages/rrweb-snapshot/src/snapshot.ts @@ -1,20 +1,22 @@ -import { - type serializedNode, - type serializedNodeWithId, - NodeType, - type attributes, - type MaskInputOptions, - type SlimDOMOptions, - type DataURLOptions, - type DialogAttributes, - type MaskTextFn, - type MaskInputFn, - type KeepIframeSrcFn, - type ICanvas, - type elementNode, - type serializedElementNodeWithId, - type mediaAttributes, +import type { + MaskInputOptions, + SlimDOMOptions, + MaskTextFn, + MaskInputFn, + KeepIframeSrcFn, + ICanvas, + DialogAttributes, } from './types'; +import { NodeType } from '@rrweb/types'; +import type { + serializedNode, + serializedNodeWithId, + serializedElementNodeWithId, + elementNode, + attributes, + mediaAttributes, + DataURLOptions, +} from '@rrweb/types'; import { Mirror, is2DCanvasBlank, diff --git a/packages/rrweb-snapshot/src/types.ts b/packages/rrweb-snapshot/src/types.ts index 95a4024960..83b50e266f 100644 --- a/packages/rrweb-snapshot/src/types.ts +++ b/packages/rrweb-snapshot/src/types.ts @@ -1,126 +1,9 @@ -export enum NodeType { - Document, - DocumentType, - Element, - Text, - CDATA, - Comment, -} - -export type documentNode = { - type: NodeType.Document; - childNodes: serializedNodeWithId[]; - compatMode?: string; -}; - -export type documentTypeNode = { - type: NodeType.DocumentType; - name: string; - publicId: string; - systemId: string; -}; - -type cssTextKeyAttr = { - _cssText?: string; -}; - -export type attributes = cssTextKeyAttr & { - [key: string]: - | string - | number // properties e.g. rr_scrollLeft or rr_mediaCurrentTime - | true // e.g. checked on - | null; // an indication that an attribute was removed (during a mutation) -}; - -export type legacyAttributes = { - /** - * @deprecated old bug in rrweb was causing these to always be set - * @see https://github.com/rrweb-io/rrweb/pull/651 - */ - selected: false; -}; - -export type elementNode = { - type: NodeType.Element; - tagName: string; - attributes: attributes; - childNodes: serializedNodeWithId[]; - isSVG?: true; - needBlock?: boolean; - // This is a custom element or not. - isCustom?: true; -}; - -export type textNode = { - type: NodeType.Text; - textContent: string; - /** - * @deprecated styles are now always snapshotted against parent