Puppeteer Screenshot Larger Than 16384px

This repository provides a function to overcome the issue with Puppeteer's fullPage: true screenshot option where, if the page height exceeds 16384px, only the first part of the page is captured repeatedly, omitting the rest of the content.

Background Chromium's software GL backend has a maximum texture size limitation, which affects Puppeteer's ability to capture full-page screenshots if the page height exceeds 16384px (or 4096px in some cases). As a result, only the initial part of the page up to this height limit is captured, and the subsequent content is ignored. This module provides a workaround to this limitation by stitching together multiple screenshots to create a complete image.

Installation

Clone this repository:

git clone https://github.com/matsuyama-k1/puppeteer-screenshot-larger-than-16384px

Install the necessary dependencies:

npm install puppeteer sharp

Usage

import puppeteer from "puppeteer";
import takeFullPageScreenshot from "./puppeteer-screenshot-larger-than-16384px";

// Example usage in a Puppeteer script
(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  // Navigate to the page you want to capture
  await page.goto("https://example.com");

  // Capture a full-page screenshot
  const screenshot = await takeFullPageScreenshot(page);

  // Save the screenshot to a file
  require("fs").writeFileSync("fullpage-screenshot.png", screenshot);

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