Playwright Tutorial For Beginners 7 - Videos

Playwright can record videos for all pages in a browser context.

A BrowserContext is an isolated incognito-alike session within a browser. Just like when you open an incognito window of your browser, the browser state (cache, cookies etc.) is isolated between test.

Using the page provide by Playwright test runner, @playwright/test, the page provided in the tests callback opens in a new context out of the box.

To record a video, we will:

• create a new context from a browser with some options in place
• create a new page with from the context
• open a web app in the page
• make sure to close the context (the video is generated after this

We will create a test scripts in demo.spec.js and run to generate a video:

// demo.spec.js
const { test } = require('@playwright/test');

test('Demo video', async ({ browser }) => {
  const context = await browser.newContext({ recordVideo: { dir: 'videos' } });
  const page = await context.newPage();
  await page.goto('https://google.com');

  await page.type('input', 'playwright');
  await page.press('input', 'Enter');
  await page.waitForTimeout(1000);

  await context.close();
});

The test will generate a video in a /videos folder.