Take screenshot of an URL using puppeteer

# build
docker build . -t screenshot

# execution
docker run -it --rm -v $(pwd):/output screenshot \
  --url https://google.com \
  --wait 3000 \
  --size 1024x768 \
  --output /output/screenshot.png

FROM alpine:edge

ENV NODE_ENV='production'
ENV NO_COLOR='true'

# Installs latest Chromium (89) package.
RUN apk add --no-cache \
      chromium \
      nss \
      freetype \
      freetype-dev \
      harfbuzz \
      ca-certificates \
      ttf-freefont \
      nodejs \
      yarn

# Tell Puppeteer to skip installing Chrome. We'll be using the installed package.
ENV PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true \
    PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium-browser

# Puppeteer v6.0.0 works with Chromium 89.
RUN yarn add puppeteer@6.0.0

# Add user so we don't need --no-sandbox.
RUN addgroup -S pptruser && adduser -S -g pptruser pptruser \
    && mkdir -p /home/pptruser/Downloads /app \
    && chown -R pptruser:pptruser /home/pptruser \
    && chown -R pptruser:pptruser /app

COPY . /app/screenshot/
WORKDIR /app/screenshot

# Run everything after as non-privileged user.
USER pptruser

ENTRYPOINT ["node", "/app/screenshot"]

{
  "name": "screenshot",
  "version": "1.0.0",
  "description": "Take screenshot of an URL",
  "main": "screenshot.mjs",
  "type": "module",
  "scripts": {},
  "author": "Sébastien Demanou",
  "license": "MIT"
}

import puppeteer from "puppeteer";
import commander from "commander";

function parseIntValidator(value) {
  // parseInt takes a string and a radix
  const parsedValue = Number.parseInt(value, 10);

  if (isNaN(parsedValue)) {
    throw new commander.InvalidOptionArgumentError("Not a number.");
  }

  return parsedValue;
}

const program = new commander.Command();

program.name("screenshot");
program.version("1.0.0");
program.description("Take screenshot of an URL");

program
  .requiredOption("-u, --url <url>", "Page URL")
  .option("-s, --size <size>", "Screenshot size", "1024x768")
  .requiredOption("-o, --output <file>", "Output filename")
  .option(
    "-w, --wait <milliseconds>",
    "Pauses execution for the given number of milliseconds before taking screenshot",
    parseIntValidator,
  )
  .action(async () => {
    const { url, size, wait, output, outputVariables } = program.opts();
    const [width, height] = size.toLowerCase().split(/x/);

    const browser = await puppeteer.launch({
      headless: true,
      args: ["--no-sandbox", "--disable-dev-shm-usage"],
    });
    const page = await browser.newPage();

    await page.setViewport({
      width: Number.parseInt(width, 10),
      height: Number.parseInt(height, 10),
      deviceScaleFactor: 1,
    });

    try {
      process.stdout.write(`Opening page ${url}\n`);
      await page.goto(url);

      if (wait) {
        process.stdout.write(`Wait for timeout ${wait}ms\n`);
        await page.waitForTimeout(wait);
      }

      process.stdout.write(`Taking screenshot of ${url}...\n`);
      await page.screenshot({ path: output });
      process.stdout.write(`Screenshot saved to ${output}\n`);
      await page.close();
      await browser.close();
      process.exit(0);
    } catch (err) {
      console.error(err);
      await page.close();
      await browser.close();
      process.exit(1);
    }
  });

program.parse();