What is Puppeteer?

A headless browser is a web browser, without a graphical user interface, that is mainly used for automated testing.

Features

Puppeteer enables you to do most of the things that you can do manually in the browser. These features include:

• Generate screenshots and PDFs of pages.
• Crawl a SPA (Single-Page Application) and generate pre-rendered content (i.e., “SSR” (Server-Side Rendering)).
• Automate form submission, UI testing, keyboard input, etc.
• Create an up-to-date, automated testing environment. Run your tests directly in the latest version of Chrome using the latest JavaScript and browser features.
• Capture a timeline trace of your site to help diagnose performance issues.
• Test Chrome Extensions.

Installation

To use Puppeteer in your project, run:

npm i puppeteer

When you install Puppeteer, it downloads a recent version of Chromium by default.

There is also the puppeteer-core package, a version of Puppeteer that doesn’t download any browser by default. To install this package, run:

npm i puppeteer-core

Read more on the difference between puppeteer and puppeteer-core here.

Code

An example code of using puppeteer that navigates to https://www.educative.io, takes a screenshot, and saves as example.png:

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.educative.io');
  await page.screenshot({path: 'example.png'});

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