headless chrome capture screen video or animation headless chrome capture screen video or animation google-chrome google-chrome

headless chrome capture screen video or animation


Every received frame also has to be acknowledged.

    await Page.navigate({url: 'http://www.goodboydigital.com/pixijs/examples/12-2/'});    await Page.loadEventFired();    await Page.startScreencast({format: 'png', everyNthFrame: 1});    let counter = 0;    while(counter < 100){      const {data, metadata, sessionId} = await Page.screencastFrame();      console.log(metadata);      await Page.screencastFrameAck({sessionId: sessionId});    }

link to github issue for detailed explanation.


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.