Using this package you are able to screen capture your puppeteer pages.

Installation

To use this package a ffmpeg binary needs to be available. You can obtain it from here or using the ffmpeg-static package.

Using yarn:

$ yarn add @kldzj/puppeteer-stream

Using npm:

$ npm i -S @kldzj/puppeteer-stream

Usage

View the examples on how to use this package.

Notes on using the x11 recorder

When using the x11 recorder it is recommended to render to a xvfb server.

$ export DEBUG=puppeteer-stream:*
$ xvfb-run -s "-screen 0 1920x1080x24" yarn ts-node examples/x11.ts

Code

const browser = await puppeteer.launch();
const page = await browser.newPage();

// https://github.com/puppeteer/puppeteer/issues/6904
const streamer = new PuppeteerStreamer(page as unknown as Page, {
  // ffmpegPath: '/path/to/ffmpeg',
  output: {
    format: 'mp4',
    path: join(process.cwd(), 'output.mp4'),
  },
  frameSize: {
    width: 1280,
    height: 720,
  },
  fps: 30,
});

// navigate page
await page.goto('https://example.com');

// start recording
await streamer.start();

// do something
await page.waitFor(1000);

// stop recording
await streamer.stop();

// finish up
await browser.close();