Avoid circular dependencies and import un-bundled rrdom

getsentry · May 2, 2022 · 72e23b8 · 72e23b8
1 parent 85d600a
commit 72e23b8
Show file tree

Hide file tree

Showing 10 changed files with 57 additions and 60 deletions.
diff --git a/packages/rrdom/rollup.config.js b/packages/rrdom/rollup.config.js
@@ -1,7 +1,6 @@
 import resolve from '@rollup/plugin-node-resolve';
 import commonjs from '@rollup/plugin-commonjs';
 import esbuild, { minify } from 'rollup-plugin-esbuild';
-
 import webWorkerLoader from 'rollup-plugin-web-worker-loader';
 import pkg from './package.json';
 

diff --git a/packages/rrdom/src/diff.ts b/packages/rrdom/src/diff.ts
@@ -15,6 +15,7 @@ import type {
   IRRText,
   Mirror,
 } from './document';
+import { StyleRuleType, VirtualStyleRules } from './types';
 import type {
   RRCanvasElement,
   RRElement,
@@ -418,38 +419,6 @@ export function getNestedRule(
   }
 }
 
-export enum StyleRuleType {
-  Insert,
-  Remove,
-  Snapshot,
-  SetProperty,
-  RemoveProperty,
-}
-type InsertRule = {
-  cssText: string;
-  type: StyleRuleType.Insert;
-  index?: number | number[];
-};
-type RemoveRule = {
-  type: StyleRuleType.Remove;
-  index: number | number[];
-};
-type SetPropertyRule = {
-  type: StyleRuleType.SetProperty;
-  index: number[];
-  property: string;
-  value: string | null;
-  priority: string | undefined;
-};
-type RemovePropertyRule = {
-  type: StyleRuleType.RemoveProperty;
-  index: number[];
-  property: string;
-};
-
-export type VirtualStyleRules = Array<
-  InsertRule | RemoveRule | SetPropertyRule | RemovePropertyRule
->;
 
 export function getPositionsAndIndex(nestedIndex: number[]) {
   const positions = [...nestedIndex];

diff --git a/packages/rrdom/src/types.ts b/packages/rrdom/src/types.ts
@@ -0,0 +1,33 @@
+export enum StyleRuleType {
+  Insert,
+  Remove,
+  Snapshot,
+  SetProperty,
+  RemoveProperty,
+}
+
+type InsertRule = {
+  cssText: string;
+  type: StyleRuleType.Insert;
+  index?: number | number[];
+};
+type RemoveRule = {
+  type: StyleRuleType.Remove;
+  index: number | number[];
+};
+type SetPropertyRule = {
+  type: StyleRuleType.SetProperty;
+  index: number[];
+  property: string;
+  value: string | null;
+  priority: string | undefined;
+};
+type RemovePropertyRule = {
+  type: StyleRuleType.RemoveProperty;
+  index: number[];
+  property: string;
+};
+
+export type VirtualStyleRules = Array<
+  InsertRule | RemoveRule | SetPropertyRule | RemovePropertyRule
+>;
diff --git a/packages/rrdom/src/virtual-dom.ts b/packages/rrdom/src/virtual-dom.ts
@@ -26,7 +26,7 @@ import {
   createMirror,
   Mirror,
 } from './document';
-import type { VirtualStyleRules } from './diff';
+import type { VirtualStyleRules } from './types';
 
 export class RRDocument extends BaseRRDocumentImpl(RRNode) {
   public mirror: Mirror = createMirror();
@@ -318,4 +318,3 @@ export function buildFromDom(
 }
 
 export { RRNode };
-export { diff, createOrGetNode, StyleRuleType } from './diff';
diff --git a/packages/rrweb/src/replay/index.ts b/packages/rrweb/src/replay/index.ts
@@ -15,14 +15,13 @@ import {
   RRIFrameElement,
   RRMediaElement,
   RRCanvasElement,
-  StyleRuleType,
-  VirtualStyleRules,
-  createOrGetNode,
   buildFromNode,
   buildFromDom,
-  diff,
-} from 'rrdom/es/virtual-dom';
-import type { Mirror as RRDOMMirror } from 'rrdom/es/document';
+} from 'rrdom/src/virtual-dom';
+import type { Mirror as RRDOMMirror } from 'rrdom/src/document';
+import type { VirtualStyleRules } from 'rrdom/src/types';
+import { StyleRuleType } from 'rrdom/src/types';
+import { createOrGetNode, diff } from 'rrdom/src/diff';
 import * as mittProxy from 'mitt';
 import { polyfill as smoothscrollPolyfill } from './smoothscroll';
 import { Timer } from './timer';
@@ -73,7 +72,7 @@ import getInjectStyleRules from './styles/inject-style';
 import './styles/style.css';
 import canvasMutation from './canvas';
 import { deserializeArg } from './canvas/deserialize-args';
-import type { ReplayerHandler } from 'rrdom/es/diff';
+import type { ReplayerHandler } from 'rrdom/src/diff';
 
 const SKIP_TIME_THRESHOLD = 10 * 1000;
 const SKIP_TIME_INTERVAL = 5 * 1000;
@@ -125,7 +124,7 @@ export class Replayer {
   private nextUserInteractionEvent: eventWithTime | null;
 
   // tslint:disable-next-line: variable-name
-  private legacy_missingNodeRetryMap: missingNodeMap = {};
+  private legacy_missingNodeRetryMap: missingNodeMap<Node | RRNode> = {};
 
   // The replayer uses the cache to speed up replay and scrubbing.
   private cache: BuildCache = createCache();
@@ -1413,7 +1412,7 @@ export class Replayer {
     });
 
     // tslint:disable-next-line: variable-name
-    const legacy_missingNodeMap: missingNodeMap = {
+    const legacy_missingNodeMap: missingNodeMap<Node | RRNode> = {
       ...this.legacy_missingNodeRetryMap,
     };
     const queue: addedNodeMutation[] = [];
@@ -1733,7 +1732,7 @@ export class Replayer {
   }
 
   private legacy_resolveMissingNode(
-    map: missingNodeMap,
+    map: missingNodeMap<Node | RRNode>,
     parent: Node | RRNode,
     target: Node | RRNode,
     targetMutation: addedNodeMutation,
@@ -1742,7 +1741,7 @@ export class Replayer {
     const previousInMap = previousId && map[previousId];
     const nextInMap = nextId && map[nextId];
     if (previousInMap) {
-      const { node, mutation } = previousInMap as missingNode;
+      const { node, mutation } = previousInMap as missingNode<Node | RRNode>;
       parent.insertBefore(node as Node & RRNode, target as Node & RRNode);
       delete map[mutation.node.id];
       delete this.legacy_missingNodeRetryMap[mutation.node.id];
@@ -1751,7 +1750,7 @@ export class Replayer {
       }
     }
     if (nextInMap) {
-      const { node, mutation } = nextInMap as missingNode;
+      const { node, mutation } = nextInMap as missingNode<Node | RRNode>;
       parent.insertBefore(
         node as Node & RRNode,
         target.nextSibling as Node & RRNode,

diff --git a/packages/rrweb/src/types.ts b/packages/rrweb/src/types.ts
@@ -11,7 +11,6 @@ import type { PackFn, UnpackFn } from './packer/base';
 import type { IframeManager } from './record/iframe-manager';
 import type { ShadowDomManager } from './record/shadow-dom-manager';
 import type { Replayer } from './replay';
-import type { RRNode } from 'rrdom/es/virtual-dom';
 import type { CanvasManager } from './record/observers/canvas/canvas-manager';
 
 export enum EventType {
@@ -669,12 +668,12 @@ export type playerMetaData = {
   totalTime: number;
 };
 
-export type missingNode = {
-  node: Node | RRNode;
+export type missingNode<TNode> = {
+  node: TNode;
   mutation: addedNodeMutation;
 };
-export type missingNodeMap = {
-  [id: number]: missingNode;
+export type missingNodeMap<TNode> = {
+  [id: number]: missingNode<TNode>;
 };
 
 export type actionWithDelay = {

diff --git a/packages/rrweb/src/utils.ts b/packages/rrweb/src/utils.ts
@@ -10,7 +10,7 @@ import type {
 } from './types';
 import type { IMirror, Mirror } from 'rrweb-snapshot';
 import { isShadowRoot, IGNORED_NODE } from 'rrweb-snapshot';
-import type { RRNode, RRIFrameElement } from 'rrdom/es/virtual-dom';
+import type { RRNode, RRIFrameElement } from 'rrdom/src/virtual-dom';
 
 export function on(
   type: string,

diff --git a/packages/rrweb/typings/replay/index.d.ts b/packages/rrweb/typings/replay/index.d.ts
@@ -1,5 +1,5 @@
 import { Mirror } from 'rrweb-snapshot';
-import { RRDocument } from 'rrdom/es/virtual-dom';
+import { RRDocument } from 'rrdom/src/virtual-dom';
 import { Timer } from './timer';
 import { createPlayerService, createSpeedService } from './machine';
 import { eventWithTime, playerConfig, playerMetaData, Handler } from '../types';

diff --git a/packages/rrweb/typings/types.d.ts b/packages/rrweb/typings/types.d.ts
@@ -3,7 +3,6 @@ import type { PackFn, UnpackFn } from './packer/base';
 import type { IframeManager } from './record/iframe-manager';
 import type { ShadowDomManager } from './record/shadow-dom-manager';
 import type { Replayer } from './replay';
-import type { RRNode } from 'rrdom/es/virtual-dom';
 import type { CanvasManager } from './record/observers/canvas/canvas-manager';
 export declare enum EventType {
     DomContentLoaded = 0,
@@ -477,12 +476,12 @@ export declare type playerMetaData = {
     endTime: number;
     totalTime: number;
 };
-export declare type missingNode = {
-    node: Node | RRNode;
+export declare type missingNode<TNode> = {
+    node: TNode;
     mutation: addedNodeMutation;
 };
-export declare type missingNodeMap = {
-    [id: number]: missingNode;
+export declare type missingNodeMap<TNode> = {
+    [id: number]: missingNode<TNode>;
 };
 export declare type actionWithDelay = {
     doAction: () => void;

diff --git a/packages/rrweb/typings/utils.d.ts b/packages/rrweb/typings/utils.d.ts
@@ -1,6 +1,6 @@
 import type { throttleOptions, listenerHandler, hookResetter, blockClass, addedNodeMutation, DocumentDimension, IWindow, DeprecatedMirror } from './types';
 import type { IMirror, Mirror } from 'rrweb-snapshot';
-import type { RRNode, RRIFrameElement } from 'rrdom/es/virtual-dom';
+import type { RRNode, RRIFrameElement } from 'rrdom/src/virtual-dom';
 export declare function on(type: string, fn: EventListenerOrEventListenerObject, target?: Document | IWindow): listenerHandler;
 export declare let _mirror: DeprecatedMirror;
 export declare function throttle<T>(func: (arg: T) => void, wait: number, options?: throttleOptions): (arg: T) => void;