Record a video using playwright and FFMPEG

runner.js

/*
 * usage
 * node runner.js | ffmpeg -y -c:v png -f image2pipe -r 30 -i - -c:v libx264 -pix_fmt yuv420p -movflags +faststart output.mp4
 *
 */ 
const { chromium } = require('playwright');

const WIDTH = 1920;
const HEIGHT = 1080;
const URL = 'URL_GOES_HERE';
const DURATION_SECONDS = 10; // in seconds, how long to record
const WAIT_PERIOD_SECONDS = Math.round(1/30); // in seconds, how long to wait between screenshots

async function captureScreenshots() {
  const browser = await chromium.launch();
  const page = await browser.newPage();

  await page.setViewportSize({ width: WIDTH, height: HEIGHT });

  // Calculate the number of screenshots to capture
  const numberOfScreenshots = Math.ceil(DURATION_SECONDS / WAIT_PERIOD_SECONDS);
  await page.goto(URL);

  const screenshots = [];
  for (let i = 0; i < numberOfScreenshots; i++) {
    const screenshotData = await page.screenshot({ encoding: 'base64', format: 'png' });
    screenshots.push(screenshotData);
    await page.waitForTimeout(WAIT_PERIOD_SECONDS * 1000);
  }
  await browser.close();

  return screenshots;
}

captureScreenshots()
  .then(screenshots => {
    screenshots.forEach(screenshotData => process.stdout.write(screenshotData));
  })
  .catch(error => {
    console.error('Error:', error);
    process.exit(1);
  });