[draft] Experiment: unfreeze PR #1637 tests #1762

Juice10 · 2025-11-21T09:28:29Z

Experiment to see if I can get: #1637 to pass the tests

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

Update playwright dependency to latest version and refactor test execution options to use a shared configuration with increased timeout for stability.

changeset-bot · 2025-11-21T09:28:32Z

🦋 Changeset detected

Latest commit: 4deec4a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 19 packages

Name	Type
@rrweb/all	Patch
@rrweb/packer	Patch
@rrweb/record	Patch
rrweb-snapshot	Patch
rrweb	Patch
@rrweb/web-extension	Patch
rrvideo	Patch
rrdom	Patch
rrdom-nodejs	Patch
rrweb-player	Patch
@rrweb/replay	Patch
@rrweb/types	Patch
@rrweb/utils	Patch
@rrweb/rrweb-plugin-console-record	Patch
@rrweb/rrweb-plugin-console-replay	Patch
@rrweb/rrweb-plugin-sequential-id-record	Patch
@rrweb/rrweb-plugin-sequential-id-replay	Patch
@rrweb/rrweb-plugin-canvas-webrtc-record	Patch
@rrweb/rrweb-plugin-canvas-webrtc-replay	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

…cess 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.

…bility - Add Playwright Chromium installation step to CI workflow - Change test execution stdio from 'pipe' to 'inherit' for better debugging

…t 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.

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.

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.

Juice10 · 2026-01-02T10:19:15Z

packages/rrvideo/src/index.ts

  Object.assign(config, options);
  if (config.resolutionRatio > 1) config.resolutionRatio = 1; // The max value is 1.

+  console.log('[DEBUG] Starting transformToVideo');


Suggested change

console.log('[DEBUG] Starting transformToVideo');

Juice10 · 2026-01-02T10:19:20Z

packages/rrvideo/src/index.ts

  const outputPath = path.isAbsolute(config.output)
    ? config.output
    : path.resolve(process.cwd(), config.output);
+  console.log('[DEBUG] Reading events from:', eventsPath);


Suggested change

console.log('[DEBUG] Reading events from:', eventsPath);

Juice10 · 2026-01-02T10:19:25Z

packages/rrvideo/src/index.ts


  // Make the browser viewport fit the player size.
  const maxViewport = getMaxViewport(events);
+  console.log('[DEBUG] Max viewport:', maxViewport);


Suggested change

console.log('[DEBUG] Max viewport:', maxViewport);

Juice10 · 2026-01-02T10:19:29Z

packages/rrvideo/src/index.ts

    ),
  };
  Object.assign(config.rrwebPlayer, scaledViewport);
+  console.log('[DEBUG] Launching browser with headless:', config.headless);


Suggested change

console.log('[DEBUG] Launching browser with headless:', config.headless);

Juice10 · 2026-01-02T10:19:34Z

packages/rrvideo/src/index.ts

+  console.log('[DEBUG] Browser launched successfully');
+  console.log(
+    '[DEBUG] Creating browser context with viewport:',
+    scaledViewport,
+  );


Suggested change

console.log('[DEBUG] Browser launched successfully');

console.log(

'[DEBUG] Creating browser context with viewport:',

scaledViewport,

);

Juice10 · 2026-01-02T10:20:51Z

packages/rrvideo/src/index.ts

      .finally(() => void cleanFiles(videoPath)),
    browser.close(),
  ]);
+  console.log('[DEBUG] Video transformation complete');


Suggested change

console.log('[DEBUG] Video transformation complete');

Juice10 · 2026-01-02T10:20:56Z

packages/rrvideo/src/index.ts

+  });
+  console.log('[DEBUG] Getting video path');
  const videoPath = (await page.video()?.path()) || '';
+  console.log('[DEBUG] Video path:', videoPath);


Suggested change

console.log('[DEBUG] Video path:', videoPath);

Juice10 · 2026-01-02T10:21:01Z

packages/rrvideo/src/index.ts

+        reject(err);
+      });
+  });
+  console.log('[DEBUG] Getting video path');


Suggested change

console.log('[DEBUG] Getting video path');

Juice10 · 2026-01-02T10:21:10Z

packages/rrvideo/src/index.ts

-        .exposeFunction('onReplayFinish', () => resolve())
-        .then(() => page.setContent(getHtml(events, config))),
-  );
+  console.log('[DEBUG] Starting replay');


Suggested change

console.log('[DEBUG] Starting replay');

Juice10 · 2026-01-02T10:28:20Z

packages/rrvideo/src/index.ts

+    const timeout = setTimeout(() => {
+      console.error('[DEBUG] Replay timeout - finish event never fired');
+      reject(new Error('Replay timeout'));
+    }, 120000); // 2 minute timeout


@copilot this timeout does not care about the duration of the events, and also doesn't care about their playback speed. Please calculate the duration of the events using their min/max timestamp multiplied by the playback speed + 2 minute buffer

Copilot · 2026-01-02T10:29:01Z

@Juice10 I've opened a new pull request, #1768, to work on those changes. Once the pull request is ready, I'll request review from you.

Copilot

Pull request overview

This PR upgrades major dependencies (Vite 5.x → 6.0.1, Playwright 1.32.1 → 1.56.1, esbuild 0.21.5 → 0.24.2) across the entire monorepo and fixes critical issues in the rrvideo package to unfreeze tests from PR #1637. The changes focus on resolving playback stalls in rrvideo by refactoring how rrweb-player is initialized, adding comprehensive error handling and debug logging, and ensuring Playwright browsers are properly installed in CI.

Major dependency upgrades across all packages (Vite, Playwright, esbuild)
Fixed rrvideo playback issues with improved player initialization and error handling
Added debug logging and timeout handling for better troubleshooting

Reviewed changes

Copilot reviewed 26 out of 27 changed files in this pull request and generated 7 comments.

Show a summary per file

File	Description
yarn.lock	Updated lockfile with new versions of esbuild (0.24.2), playwright (1.56.1), vite (6.0.11), and related dependencies including new optional platform dependencies
vite.config.default.ts	Added cssFileName configuration and removed commented rollup options
packages/*/package.json (18 files)	Updated vite dependency to ^6.0.1 across all packages; updated playwright to ^1.56.1 in rrvideo
packages/rrweb/package.json	Added new CSS export path "./dist/rrweb.css"
packages/rrvideo/src/index.ts	Refactored replayer initialization from Player class to direct constructor, added try-catch error handling, manual play() call, extensive debug logging, timeout mechanism, and console/error listeners
packages/rrvideo/test/cli.test.ts	Added timeout configuration (60s) and changed stdio from 'pipe' to 'inherit' for better debugging
.github/workflows/ci-cd.yml	Added step to install Playwright chromium browser before running tests
.changeset/*.md	Added changesets documenting patches for rrvideo improvements and dropping base64 inlined workers

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-01-02T10:34:07Z

packages/rrvideo/src/index.ts

+        });
+        window.replayer.addEventListener('finish', () => window.onReplayFinish());
+        window.replayer.addEventListener('ui-update-progress', (payload)=> window.onReplayProgressUpdate(payload));
+        window.replayer.addEventListener('resize',()=>document.querySelector('.replayer-wrapper').style.transform = 'scale(${


Missing space after "resize',()=>" which violates standard JavaScript formatting conventions. This should be "resize', () =>" for consistency and readability.

Suggested change

window.replayer.addEventListener('resize',()=>document.querySelector('.replayer-wrapper').style.transform = 'scale(${

window.replayer.addEventListener('resize', () => document.querySelector('.replayer-wrapper').style.transform = 'scale(${

Copilot · 2026-01-02T10:34:07Z

packages/rrvideo/test/cli.test.ts

  });

+  const execOptions = { timeout: 60_000 } as const;
+  const execOptionsWithOutput = { ...execOptions, stdio: 'inherit' } as const;


The timeout is set to 60 seconds (60_000 ms), but the code also sets stdio to 'inherit' in execOptionsWithOutput. This change is good for debugging, but using 'inherit' means the test output will be mixed with the command output. Consider documenting why this was changed from 'pipe' to 'inherit', or use a conditional based on an environment variable if this is just for debugging purposes.

Suggested change

const execOptionsWithOutput = { ...execOptions, stdio: 'inherit' } as const;

// Use 'inherit' for easier debugging when RRVIDEO_CLI_TEST_DEBUG is set,

// otherwise keep stdio as 'pipe' to avoid mixing test and CLI output.

const execOptionsWithOutput = {

...execOptions,

stdio: process.env.RRVIDEO_CLI_TEST_DEBUG ? 'inherit' : 'pipe',

} as const;

Copilot · 2026-01-02T10:34:08Z

vite.config.default.ts

    build: {
      // See https://vitejs.dev/guide/build.html#library-mode
      lib: {
+        cssFileName: 'style',


The cssFileName property is set to 'style', but this might conflict with the existing CSS file export in packages/rrweb/package.json which exports both "./dist/rrweb.css" and "./dist/style.css". This could create ambiguity about which file is which. Consider using a more specific name or verifying that this aligns with the intended CSS output structure.

Suggested change

cssFileName: 'style',

cssFileName: name,

Copilot · 2026-01-02T10:34:08Z

.changeset/eight-years-hope.md

@@ -0,0 +1,2 @@
+---
+---


This changeset file appears to be empty except for the frontmatter. An empty changeset may not be intentional and could cause issues with versioning. Either this file should be removed, or it should include a description of what changes were made and which packages are affected.

Suggested change

---

---

This changeset file contains no versioning information and was created accidentally; it can be safely removed when cleaning up changesets.

Copilot · 2026-01-02T10:34:08Z

packages/rrvideo/src/index.ts

+        window.replayer = new rrwebPlayer({
+          target: document.body,
+          props: {
+            width: userConfig.width,
+            height: userConfig.height,
+            ...userConfig,
+            events,
+            showController: false,
+            autoPlay: false,
+          },
+        });


The old API used "new rrwebPlayer.Player({...})" but the new code uses "new rrwebPlayer({...})". This is a breaking change in how the player is instantiated. The "width" and "height" properties are being spread separately before userConfig, but they're already part of userConfig. This could cause the values to be overwritten if userConfig also contains width/height properties. Consider either not spreading them separately or spreading userConfig first so the explicit values take precedence.

Copilot · 2026-01-02T10:34:09Z

packages/rrvideo/src/index.ts

+        window.replayer.addEventListener('ui-update-progress', (payload)=> window.onReplayProgressUpdate(payload));
+        window.replayer.addEventListener('resize',()=>document.querySelector('.replayer-wrapper').style.transform = 'scale(${


Missing space after "payload)=>" which violates standard JavaScript formatting conventions. This should be "payload) =>" for consistency and readability.

Suggested change

window.replayer.addEventListener('ui-update-progress', (payload)=> window.onReplayProgressUpdate(payload));

window.replayer.addEventListener('resize',()=>document.querySelector('.replayer-wrapper').style.transform = 'scale(${

window.replayer.addEventListener('ui-update-progress', (payload) => window.onReplayProgressUpdate(payload));

window.replayer.addEventListener('resize', () => document.querySelector('.replayer-wrapper').style.transform = 'scale(${

ruiconti and others added 11 commits January 24, 2025 14:41

chore: upgrades to

548e3f6

Merge branch 'master' into rui/fix-worker-b64-inlined-source

61ae54e

Create cuddly-dolphins-approve.md

aacb7c4

Merge branch 'master' into rui/fix-worker-b64-inlined-source

5ac9a19

Merge branch 'master' into rui/fix-worker-b64-inlined-source

d2e46d5

Merge branch 'master' into rui/fix-worker-b64-inlined-source

fcea902

build(rrvideo): upgrade playwright from 1.32.1 to 1.56.1

a98ad5a

Update playwright dependency to latest version and refactor test execution options to use a shared configuration with increased timeout for stability.

chore: add empty changeset

985e586

build(rrvideo): upgrade playwright from 1.32.1 to 1.56.1

88f9d83

Update playwright dependency to latest version and refactor test execution options to use a shared configuration with increased timeout for stability.

chore: add empty changeset

51eb746

Juice10 added 8 commits November 21, 2025 10:40

Apply formatting changes

2eb0631

ci(rrvideo): install playwright browsers and improve test output visi…

9f71c1a

…bility - Add Playwright Chromium installation step to CI workflow - Change test execution stdio from 'pipe' to 'inherit' for better debugging

Apply formatting changes

564c8b0

Merge branch 'juice10/rrvideo-test-update' into juice10/pr-1637-tests

2ad7690

Juice10 mentioned this pull request Jan 2, 2026

build(rrvideo): upgrade playwright from 1.32.1 to 1.56.1 #1761

Merged

Juice10 changed the base branch from juice10/rrvideo-test-update to master January 2, 2026 10:16

Juice10 commented Jan 2, 2026

View reviewed changes

Copilot AI mentioned this pull request Jan 2, 2026

Fix timeout calculation to account for event duration and playback speed #1768

Open

add changeset

4deec4a

Copilot AI review requested due to automatic review settings January 2, 2026 10:31

Copilot started reviewing on behalf of Juice10 January 2, 2026 10:31 View session

Copilot AI reviewed Jan 2, 2026

View reviewed changes

	window.replayer.addEventListener('resize',()=>document.querySelector('.replayer-wrapper').style.transform = 'scale(${
	window.replayer.addEventListener('resize', () => document.querySelector('.replayer-wrapper').style.transform = 'scale(${

	---
	---
	This changeset file contains no versioning information and was created accidentally; it can be safely removed when cleaning up changesets.

		window.replayer.addEventListener('ui-update-progress', (payload)=> window.onReplayProgressUpdate(payload));
		window.replayer.addEventListener('resize',()=>document.querySelector('.replayer-wrapper').style.transform = 'scale(${

Uh oh!

[draft] Experiment: unfreeze PR #1637 tests #1762

Are you sure you want to change the base?

[draft] Experiment: unfreeze PR #1637 tests #1762

Conversation

Juice10 commented Nov 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

changeset-bot bot commented Nov 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Copilot AI commented Jan 2, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Jan 2, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 2, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 2, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 2, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 2, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 2, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Juice10 commented Nov 21, 2025 •

edited

Loading

changeset-bot bot commented Nov 21, 2025 •

edited

Loading