22bc4c334e
* chore: maintain CSS output file name in vite@6.0.1 Without this change, build would fail because the produced stylesheet assumes the `package.json['name']` i.e., `styles/rrweb.css`. To maintain the existing behavior, these changes are required. See https://vite.dev/guide/migration.html#customize-css-output-file-name-in-library-mode * build(rrvideo): upgrade playwright from 1.32.1 to 1.56.1 Update playwright dependency to latest version and refactor test execution options to use a shared configuration with increased timeout for stability. * debug(rrvideo): add comprehensive logging to video transformation process Add detailed console.log statements throughout the transformToVideo function to track execution flow and debug potential issues. Logging covers browser launch, context creation, page navigation, replay progress, and video file operations. * ci(rrvideo): install playwright browsers and improve test output visibility - Add Playwright Chromium installation step to CI workflow - Change test execution stdio from 'pipe' to 'inherit' for better debugging * fix(rrvideo): prevent autoplay and manually start playback after event listeners Set autoPlay to false in replayer configuration and manually call play() after all event listeners are attached. This ensures event handlers are properly registered before playback begins, preventing potential race conditions. Also refactor test execution options to separate stdio configuration from timeout settings for better control over test output visibility. * fix(rrvideo): add timeout and error handling to replay process Add comprehensive error handling to prevent hanging during video transformation: - Add 2-minute timeout for replay finish event - Add console and error listeners for better debugging - Improve promise chain with proper error catching - Clear timeout on successful completion or error This prevents the process from hanging indefinitely when the replay finish event never fires. * fix(rrvideo): add error handling and restructure replayer initialization Wrap replayer initialization in try-catch block to handle potential errors gracefully. Restructure Player instantiation to use rrwebPlayer directly instead of rrwebPlayer.Player, and move width/height into props object for correct API usage. On error, log to console and trigger onReplayFinish callback to prevent hanging state. * build(umd): rename record and replay globals Update UMD build globals for recorder and replayer and refresh documentation accordingly. BREAKING CHANGE: UMD global names changed to rrwebRecord and rrwebReplay. * fix(rrvideo): adjust replay timeout to duration * docs: update rrweb-player CDN script path * Update vite.config.default.ts Co-authored-by: Eoghan Murray <eoghan@getthere.ie> --------- Co-authored-by: Rui <rui@conti.sh> Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Co-authored-by: Eoghan Murray <eoghan@getthere.ie>
rrweb-snapshot
Snapshot the DOM into a stateful and serializable data structure. Also, provide the ability to rebuild the DOM via snapshot.
API
This module export following methods:
snapshot
snapshot will traverse the DOM and return a stateful and serializable data structure which can represent the current DOM view.
There are several things will be done during snapshot:
- Inline some DOM states into HTML attributes, e.g, HTMLInputElement's value.
- Turn script tags into
noscripttags to avoid scripts being executed. - Try to inline stylesheets to make sure local stylesheets can be used.
- Make relative paths in href, src, CSS to be absolute paths.
- Give an id to each Node, and return the id node map when snapshot finished.
rebuild
rebuild will build the DOM according to the taken snapshot.
There are several things will be done during rebuild:
- Add data-rrid attribute if the Node is an Element.
- Create some extra DOM node like text node to place inline CSS and some states.
- Add data-extra-child-index attribute if Node has some extra child DOM.
serializeNodeWithId
serializeNodeWithId can serialize a node into snapshot format with id.
buildNodeWithSN
buildNodeWithSN will build DOM from serialized node and store serialized information in the mirror.getMeta(node).
Sponsors
Become a sponsor and get your logo on our README on Github with a link to your site.
Gold Sponsors 🥇
Silver Sponsors 🥈
Bronze Sponsors 🥉
Backers
Core Team Members
Yuyz0112 |
Yun Feng |
eoghanmurray |
Juice10 open for rrweb consulting |
Who's using rrweb?
|
|
|
|
|
|
|
|
|
|
|
|
|