视频

介绍

🌐 Introduction

使用 Playwright，你可以录制视频以供测试。

🌐 With Playwright you can record videos for your tests.

录视频

🌐 Record video

Playwright Test 可以为你的测试录制视频，通过 Playwright 配置中的 video 选项控制。默认情况下视频是关闭的。

🌐 Playwright Test can record videos for your tests, controlled by the video option in your Playwright config. By default videos are off.

'off' - 不要录制视频。
'on' - 为每次测试录制视频。
'retain-on-failure' - 为每个测试录制视频，但从成功的测试运行中删除所有视频。
'on-first-retry' - 仅在第一次重试测试时录制视频。

视频文件将出现在测试输出目录中，通常是 test-results。有关高级视频配置，请参阅 testOptions.video。

🌐 Video files will appear in the test output directory, typically test-results. See testOptions.video for advanced video configuration.

在测试结束时，视频会在关闭浏览器上下文时保存。如果你手动创建了浏览器上下文，请确保等待 browserContext.close() 方法完成。

🌐 Videos are saved upon browser context closure at the end of a test. If you create a browser context manually, make sure to await browserContext.close().

Test
Library

playwright.config.ts
import { defineConfig } from '@playwright/test';
export default defineConfig({
  use: {
    video: 'on-first-retry',
  },
});

const context = await browser.newContext({ recordVideo: { dir: 'videos/' } });
// Make sure to await close, so that videos are saved.
await context.close();

你也可以指定视频大小。视频大小默认是将视口大小缩放以适应 800x800。视口的视频会放置在输出视频的左上角，如有必要会缩放以适应。你可能需要将视口大小设置为与你想要的视频大小相匹配。

🌐 You can also specify video size. The video size defaults to the viewport size scaled down to fit 800x800. The video of the viewport is placed in the top-left corner of the output video, scaled down to fit if necessary. You may need to set the viewport size to match your desired video size.

Test
Library

playwright.config.ts
import { defineConfig } from '@playwright/test';
export default defineConfig({
  use: {
    video: {
      mode: 'on-first-retry',
      size: { width: 640, height: 480 }
    }
  },
});

const context = await browser.newContext({
  recordVideo: {
    dir: 'videos/',
    size: { width: 640, height: 480 },
  }
});

对于多页面场景，你可以通过 page.video() 访问与页面关联的视频文件。

🌐 For multi-page scenarios, you can access the video file associated with the page via the page.video().

const path = await page.video().path();

note

请注意，视频仅在页面或浏览器上下文关闭后才可用。

介绍​

录视频​

介绍

录视频