Puppeteer screenshot with cursor icon

Question

We are using puppeteers page.screenshot function (https://devdocs.io/puppeteer/index#pagescreenshotoptions) but the resulting captured image doesn't show the current mouse cursor icon. Is there a way to tell puppeteer to include the mouse cursor icon in the captured screenshot?

Answer 1

install-mouse-helper.js

You can use install-mouse-helper.js to inject a box in the page that moves with the mouse in Puppeteer and is visible in screenshots:

const puppeteer = require('puppeteer');
const {installMouseHelper} = require('./install-mouse-helper');

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

  await installMouseHelper(page); // Install Mouse Helper

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

  await page.mouse.move(100, 200);
  await page.mouse.down();
  await page.mouse.move(500, 250);

  await page.screenshot({
    path: 'example.png',
  });

  await browser.close();
})();