headless chrome capture screen video or animation

Question

I try to capture some animations from a website and stitch them together using ffmpeg. As far as I understand the docs startScreencast is the way to go.

If I underst

Answer 1

I had the same issue. It did not print anything because the process terminated before the first frame event was received, which makes sense to me. I solved it by keeping the process alive for at least 5 seconds.

This worked for me:

await Page.startScreencast({
  format: 'png',
  everyNthFrame: 1,
});

Page.screencastFrame(image => {
  const {data, metadata, sessionId} = image;
  console.log(metadata);
  Page.screencastFrameAck({sessionId: sessionId});
});

await new Promise(r => setTimeout(r, 5000)); // wait 5 seconds

This way, we don't need any loop.

Note that it also worked for me without acknowledging every frame.

The frame rates are pretty low on my machine (~10fps despite having chrome render at 60 FPS). Maybe it only sends every frame which actually has different content.