Chore: Migrate build to vite (#1033)

* Chore: Add move most types from rrweb to @rrweb/types package * Split off type imports * Split off type import to its own line * Get vite to generate type definitions * Apply formatting changes * noEmit not allowed in tsconfig, moved it to build step * Migrate rrdom-nodejs build to vite * Apply formatting changes * Migrate rrweb-snapshot to vite * Unify configs * Chore: Migrate rrdom to vite Turns out what we where doing by overwriting `public textContent: string | undefined` as a getter in a subclass is something that isn't allowed in typescript. Because we where using `// @ts-ignore` to hide this error our bundler chose to allow the overwrite. Vite choses to disallow the overwrite making all subclasses' `textContent` undefined. To mitigate this we're using an abstract class, which does allow sub classes to decide if they wan't to use getters or not. * Chore: Migrate rrweb to vite WIP * build:browser was removed (for now) * BREAKING: moved rrweb-plugin-console to its own npm module This removes console from rrweb-all.js * Support cjs files in startServer * Move canvas-webrtc plugin to its own package * Chore: move sequential-id plugin to its own package * Chore: Configure rrweb's vite bundling * `Id` had lowercase `d` before, making it lowercase again * Test: Move console tests to their own package * remove unused utils from rrdom * pull in latest version of master something when wrong earlier when resolving merge conflicts, this should be correct * Fix type casting issue in diff.ts * Fix typo * Fix duplicate entries in package.json and tsconfig.json * Apply formatting changes * Update dependencies in package.json files * Update dependencies to use Vite 5.2.8 in package.json files * Get tests passing for rrdom `apply virtual style rules to node` tests need to be moved to rrweb to avoid circular dependencies * Fix image loading issue in integration tests * Move pack/unpack to its own @rrweb/packer module * Get tests to work in rrdom-nodejs * Port tests in rrweb-snapshot to vitest and fix them * Fix tests for rrweb-plugin-console-record * Add @rrweb/all package * Fix publint and attw errors for rrdom and @rrweb/types * Use shared vitest.config.ts in rrweb-snapshot package * Fix publint and attw issues for rrweb-snapshot * Export `ReplayPlugin` type directly from rrweb * Fix publint and attw issues for packages * Fix publint & attw issue. I was bumping into this issue: 3729bc2a3c/docs/problems/NoResolution.md And had to choose one of these three methods described here: https://github.com/andrewbranch/example-subpath-exports-ts-compat?tab=readme-ov-file#typescript-friendly-strategies-for-packagejson-subpath-exports-compatibility And I ended up going for the method described here: 1ffe3425b0/examples/node_modules/package-json-redirects (package-json-redirects) The redirect method seemed the least invasive and most effective. * Fix publint & attw issue. I was bumping into this issue: 3729bc2a3c/docs/problems/NoResolution.md And had to choose one of these three methods described here: https://github.com/andrewbranch/example-subpath-exports-ts-compat?tab=readme-ov-file#typescript-friendly-strategies-for-packagejson-subpath-exports-compatibility And I ended up going for the method described here: 1ffe3425b0/examples/node_modules/package-json-redirects (package-json-redirects) The redirect method seemed the least invasive and most effective. * move some rrdom tests that require rrweb to rrweb package * Use pre-jest 29 syntax for snapshotting * get rrweb passing publint and attw * const enum does not work with isolated modules flag * Fix script tag type in webgl.test.ts.snap and update rrweb.umd.cjs path in webgl.test.ts * Fix paths * Move tests for console record plugin and fix bundle path * Fix tests for rrweb * pack integration tests were moved to @rrweb/all * Update rrweb bundle path in test files * Fix flaky scroll emit from test * Migrate rrweb's tests over to vitest and make them pass * Make sure benchmarks & updating tests work * Remove jest from rrweb * Fix paths * always use rrweb's own cssom * Update tsconfig.json for rrweb-plugin-sequential-id-record Fixes this error: Error: @rrweb/rrweb-plugin-sequential-id-record:prepublish: tsconfig.json(9,5): error TS6377: Cannot write file '/home/runner/work/rrweb/rrweb/tsconfig.tsbuildinfo' because it will overwrite '.tsbuildinfo' file generated by referenced project '/home/runner/work/rrweb/rrweb/packages/rrweb' * Add tsbuildinfo config to extended tsconfig files * Move rrdom over to vitest * Apply formatting changes * Update rrweb imports to use the new package structure * extend rrweb-snapshot's tsconfig from monorepo base config * extend @rrweb/types's tsconfig from monorepo base config * extend rrdom's tsconfig from monorepo base config * extend rrdom-nodejs's tsconfig from monorepo base config * extend web-extension's tsconfig from monorepo base config * unify tsconfigs * Continue when tests fail * Add stricter type checking * Add check-types global command * remove jest * Remove unused code * Add check-types command to build script * Fix linting issues * Add setup Chrome action for CI/CD workflow * Update puppeteer version in package.json for rrweb * Update Chrome setup in CI/CD workflow * Update Chrome setup in CI/CD workflow * Add Chrome setup and test cache location * Update CI/CD workflow to test chrome cache location * Add chrome installation step to CI/CD workflow * Update Puppeteer configuration for headless testing * Update dependencies and workflow configuration * Use same version of chrome on CI as is run locally * Use version of chrome that seems to work with rrdom tests * Try using puppeteerrc to define chrome version * Add .cache directory to .gitignore * Move global flag to vitest config * Update puppeteer version to 20.9.0 * Update console log messages in rrweb-plugin-console-record for new puppeteer version * Remove redundant Chrome setup from CI/CD workflow * Add minification and umd for all built files * Update import paths for rrweb dist files * Add @rrweb/replay and @rrweb/record * Add script to lint packages * Apply formatting changes * exclude styles export from typescript package type checking * WIP Move rrweb-player over to vite * Apply formatting changes * chore: Update rrweb plugin import paths * Remove rollup from rrweb-player * Fix typing issues * Fix typing issues * chore: Update rrweb-player to use vite for build process * Apply formatting changes * chore: Export Player class in rrweb-player/src/main.ts Makes attw happy * Apply formatting changes * Gets wiped by yarn workspaces-to-typescript-project-references * Add .eslintignore and .eslintrc.cjs files for rrweb-player package * Apply formatting changes * Update dependencies in rrweb-player/package.json * Apply formatting changes * chore: Update eslint configuration for rrweb-player package * Apply formatting changes * chore: Remove unused files from rrweb-player package * Apply formatting changes * chore: Update rrweb-player import path to use rrweb-player.cjs * chore: Update addEventListener signature in rrweb-player * Apply formatting changes * Add .eslintignore and update .gitignore files for to root * Apply formatting changes * Update documentation * Update @rrweb/types package description * Apply formatting changes * Update build and run commands in CONTRIBUTING.md * Apply formatting changes * Update package versions to 2.0.0-alpha.13 * Apply formatting changes * Apply formatting changes * Fix import statement in media/index.ts * Apply formatting changes * chore: Update .gitignore to exclude build and dist directories * Apply formatting changes * Apply formatting changes * Migrate setTimeout to vitest * Apply formatting changes * Apply formatting changes * Fix isNativeShadowDom function signature in utils.ts * try out jsr * Apply formatting changes * Update package versions to 2.0.0-alpha.14 * Apply formatting changes * Fix name of rrwebSnapshot object * Apply formatting changes * Remove unused lock files * Apply formatting changes * Update rrweb bundle path to use umd.cjs format * Apply formatting changes * Trigger tests to run again * Rename snapshots for vitest * Apply formatting changes * Ping CI * Apply formatting changes * Ping CI * Apply formatting changes * Ignore files generated by svelte-kit for prettier * Correct Player object
2026-04-01 12:00:00 +08:00
parent 4055c69e26
commit 5a85ddf013
266 changed files with 11616 additions and 9614 deletions
--- a/packages/plugins/rrweb-plugin-console-record/src/stringify.ts
+++ b/packages/plugins/rrweb-plugin-console-record/src/stringify.ts
@@ -0,0 +1,194 @@
+/**
+ * this file is used to serialize log message to string
+ *
+ */
+
+import type { StringifyOptions } from './index';
+
+/**
+ * transfer the node path in Event to string
+ * @param node - the first node in a node path array
+ */
+function pathToSelector(node: HTMLElement): string | '' {
+  if (!node || !node.outerHTML) {
+    return '';
+  }
+
+  let path = '';
+  while (node.parentElement) {
+    let name = node.localName;
+    if (!name) {
+      break;
+    }
+    name = name.toLowerCase();
+    const parent = node.parentElement;
+
+    const domSiblings = [];
+
+    if (parent.children && parent.children.length > 0) {
+      for (let i = 0; i < parent.children.length; i++) {
+        const sibling = parent.children[i];
+        if (sibling.localName && sibling.localName.toLowerCase) {
+          if (sibling.localName.toLowerCase() === name) {
+            domSiblings.push(sibling);
+          }
+        }
+      }
+    }
+
+    if (domSiblings.length > 1) {
+      name += `:eq(${domSiblings.indexOf(node)})`;
+    }
+    path = name + (path ? '>' + path : '');
+    node = parent;
+  }
+
+  return path;
+}
+
+/**
+ * judge is object
+ */
+function isObject(obj: unknown): boolean {
+  return Object.prototype.toString.call(obj) === '[object Object]';
+}
+
+/**
+ * judge the object's depth
+ */
+function isObjTooDeep(obj: Record<string, unknown>, limit: number): boolean {
+  if (limit === 0) {
+    return true;
+  }
+
+  const keys = Object.keys(obj);
+  for (const key of keys) {
+    if (
+      isObject(obj[key]) &&
+      isObjTooDeep(obj[key] as Record<string, unknown>, limit - 1)
+    ) {
+      return true;
+    }
+  }
+
+  return false;
+}
+
+/**
+ * stringify any js object
+ * @param obj - the object to stringify
+ */
+export function stringify(
+  obj: unknown,
+  stringifyOptions?: StringifyOptions,
+): string {
+  const options: StringifyOptions = {
+    numOfKeysLimit: 50,
+    depthOfLimit: 4,
+  };
+  Object.assign(options, stringifyOptions);
+  const stack: unknown[] = [];
+  const keys: unknown[] = [];
+  return JSON.stringify(
+    obj,
+    function (key, value: string | bigint | object | null | undefined) {
+      /**
+       * forked from https://github.com/moll/json-stringify-safe/blob/master/stringify.js
+       * to deCycle the object
+       */
+      if (stack.length > 0) {
+        const thisPos = stack.indexOf(this);
+        ~thisPos ? stack.splice(thisPos + 1) : stack.push(this);
+        ~thisPos ? keys.splice(thisPos, Infinity, key) : keys.push(key);
+        if (~stack.indexOf(value)) {
+          if (stack[0] === value) {
+            value = '[Circular ~]';
+          } else {
+            value =
+              '[Circular ~.' +
+              keys.slice(0, stack.indexOf(value)).join('.') +
+              ']';
+          }
+        }
+      } else {
+        stack.push(value);
+      }
+      /* END of the FORK */
+
+      if (value === null) return value;
+      if (value === undefined) return 'undefined';
+      if (shouldIgnore(value as object)) {
+        return toString(value as object);
+      }
+      if (typeof value === 'bigint') {
+        return value.toString() + 'n';
+      }
+      if (value instanceof Event) {
+        const eventResult: Record<string, unknown> = {};
+        for (const eventKey in value) {
+          const eventValue = (value as unknown as Record<string, unknown>)[
+            eventKey
+          ];
+          if (Array.isArray(eventValue)) {
+            eventResult[eventKey] = pathToSelector(
+              (eventValue.length ? eventValue[0] : null) as HTMLElement,
+            );
+          } else {
+            eventResult[eventKey] = eventValue;
+          }
+        }
+        return eventResult;
+      } else if (value instanceof Node) {
+        if (value instanceof HTMLElement) {
+          return value ? value.outerHTML : '';
+        }
+        return value.nodeName;
+      } else if (value instanceof Error) {
+        return value.stack
+          ? value.stack + '\nEnd of stack for Error object'
+          : value.name + ': ' + value.message;
+      }
+      return value;
+    },
+  );
+
+  /**
+   * whether we should ignore obj's info and call toString() function instead
+   */
+  function shouldIgnore(_obj: object): boolean {
+    // outof keys limit
+    if (isObject(_obj) && Object.keys(_obj).length > options.numOfKeysLimit) {
+      return true;
+    }
+
+    // is function or bigint
+    if (typeof _obj === 'function') {
+      return true;
+    }
+
+    /**
+     * judge object's depth to avoid browser's OOM
+     *
+     * issues: https://github.com/rrweb-io/rrweb/issues/653
+     */
+    if (
+      isObject(_obj) &&
+      isObjTooDeep(_obj as Record<string, unknown>, options.depthOfLimit)
+    ) {
+      return true;
+    }
+
+    return false;
+  }
+
+  /**
+   * limit the toString() result according to option
+   */
+  function toString(_obj: object): string {
+    let str = _obj.toString();
+    if (options.stringLengthLimit && str.length > options.stringLengthLimit) {
+      str = `${str.slice(0, options.stringLengthLimit)}...`;
+    }
+    return str;
+  }
+}