From 52f361b9a51dc6e20ea4a6f2ed5cae9257f4cba6 Mon Sep 17 00:00:00 2001 From: Billy Vong Date: Wed, 28 Jan 2026 12:03:46 -0500 Subject: [PATCH] Reapply "Full overhawl of video & audio playback to make it more complete (#1432)" This reverts commit c6bc3c7f7de4b7fdc747bba5672a6e78b6f01d77. --- .changeset/cool-grapes-hug.md | 5 + .changeset/dirty-rules-dress.md | 5 + .changeset/mighty-ads-worry.md | 5 + .changeset/silver-pots-sit.md | 5 + .changeset/smart-geckos-cover.md | 5 + packages/rrdom/src/diff.ts | 2 + packages/rrdom/src/document.ts | 1 + packages/rrdom/test/diff.test.ts | 2 + packages/rrdom/test/document.test.ts | 1 + packages/rrweb-snapshot/src/rebuild.ts | 11 + packages/rrweb-snapshot/src/snapshot.ts | 10 +- packages/rrweb-snapshot/src/types.ts | 21 + packages/rrweb/src/record/observer.ts | 3 +- packages/rrweb/src/replay/index.ts | 75 ++- packages/rrweb/src/replay/media/index.ts | 294 ++++++++ packages/rrweb/test/e2e/webgl.test.ts | 25 +- .../events/video-playback-on-full-snapshot.ts | 550 +++++++++++++++ packages/rrweb/test/events/video-playback.ts | 628 ++++++++++++++++++ .../rrweb/test/html/assets/bunny-video.webm | Bin 0 -> 1602346 bytes packages/rrweb/test/html/video.html | 19 + .../cross-origin-iframes.test.ts.snap | 9 +- packages/rrweb/test/replay/ video.test.ts | 240 +++++++ ...en-the-player-wasnt-started-yet-1-snap.png | Bin 0 -> 18686 bytes ...ll-play-from-the-correct-moment-1-snap.png | Bin 0 -> 141056 bytes ...will-seek-to-the-correct-moment-1-snap.png | Bin 0 -> 141252 bytes ...ithout-media-interaction-events-1-snap.png | Bin 0 -> 154767 bytes packages/rrweb/test/utils.ts | 25 + packages/types/src/index.ts | 4 + 28 files changed, 1886 insertions(+), 59 deletions(-) create mode 100644 .changeset/cool-grapes-hug.md create mode 100644 .changeset/dirty-rules-dress.md create mode 100644 .changeset/mighty-ads-worry.md create mode 100644 .changeset/silver-pots-sit.md create mode 100644 .changeset/smart-geckos-cover.md create mode 100644 packages/rrweb/src/replay/media/index.ts create mode 100644 packages/rrweb/test/events/video-playback-on-full-snapshot.ts create mode 100644 packages/rrweb/test/events/video-playback.ts create mode 100644 packages/rrweb/test/html/assets/bunny-video.webm create mode 100644 packages/rrweb/test/html/video.html create mode 100644 packages/rrweb/test/replay/ video.test.ts create mode 100644 packages/rrweb/test/replay/__image_snapshots__/video-test-ts-video-will-be-paused-when-the-player-wasnt-started-yet-1-snap.png create mode 100644 packages/rrweb/test/replay/__image_snapshots__/video-test-ts-video-will-play-from-the-correct-moment-1-snap.png create mode 100644 packages/rrweb/test/replay/__image_snapshots__/video-test-ts-video-will-seek-to-the-correct-moment-1-snap.png create mode 100644 packages/rrweb/test/replay/__image_snapshots__/video-test-ts-video-will-seek-to-the-correct-moment-without-media-interaction-events-1-snap.png diff --git a/.changeset/cool-grapes-hug.md b/.changeset/cool-grapes-hug.md new file mode 100644 index 0000000000..cde43b29ff --- /dev/null +++ b/.changeset/cool-grapes-hug.md @@ -0,0 +1,5 @@ +--- +'rrdom': patch +--- + +Support `loop` in `RRMediaElement` diff --git a/.changeset/dirty-rules-dress.md b/.changeset/dirty-rules-dress.md new file mode 100644 index 0000000000..19b2070ffc --- /dev/null +++ b/.changeset/dirty-rules-dress.md @@ -0,0 +1,5 @@ +--- +'rrweb-snapshot': minor +--- + +Video and Audio elements now also capture `playbackRate`, `muted`, `loop`, `volume`. diff --git a/.changeset/mighty-ads-worry.md b/.changeset/mighty-ads-worry.md new file mode 100644 index 0000000000..1906ac8945 --- /dev/null +++ b/.changeset/mighty-ads-worry.md @@ -0,0 +1,5 @@ +--- +'rrweb': minor +--- + +Full overhawl of `video` and `audio` element playback. More robust and fixes lots of bugs related to pausing/playing/skipping/muting/playbackRate etc. diff --git a/.changeset/silver-pots-sit.md b/.changeset/silver-pots-sit.md new file mode 100644 index 0000000000..b53a943825 --- /dev/null +++ b/.changeset/silver-pots-sit.md @@ -0,0 +1,5 @@ +--- +'@rrweb/types': patch +--- + +Add `loop` to `mediaInteractionParam` diff --git a/.changeset/smart-geckos-cover.md b/.changeset/smart-geckos-cover.md new file mode 100644 index 0000000000..a5a0e0f44c --- /dev/null +++ b/.changeset/smart-geckos-cover.md @@ -0,0 +1,5 @@ +--- +'rrweb': patch +--- + +Record `loop` on `