• 02-Jan-2023
Lightrun Team
Author Lightrun Team
Share
This is a glossary of all the common issues in Puppeteer - Puppeteer

Troubleshooting Common Issues in Puppeteer – Puppeteer

Lightrun Team
Lightrun Team
02-Jan-2023

Project Description

 

Puppeteer is a Node.js library that provides a high-level API for controlling Chrome or Chromium over the DevTools Protocol. It allows you to programmatically control a web browser, interact with websites, and perform tasks such as automated testing, web scraping, and automating workflows.

Puppeteer is built on top of the DevTools Protocol, which is a powerful and flexible way to interact with web browsers. It provides a rich set of commands and APIs for controlling and manipulating web pages, as well as debugging and profiling web applications.

Puppeteer is often used for tasks such as:

  • Automated testing of web applications
  • Web scraping and data mining
  • Automating workflows and interactions with websites
  • Generating screenshots and PDFs of web pages
  • Performance testing and monitoring
  • Debugging and profiling web applications

Puppeteer is widely used by developers and is well-supported by a large and active community. It is a powerful tool for building and testing modern web applications.

 

Troubleshooting Puppeteer – Puppeteer with the Lightrun Developer Observability Platform

 

Getting a sense of what’s actually happening inside a live application is a frustrating experience, one that relies mostly on querying and observing whatever logs were written during development.
Lightrun is a Developer Observability Platform, allowing developers to add telemetry to live applications in real-time, on-demand, and right from the IDE.
  • Instantly add logs to, set metrics in, and take snapshots of live applications
  • Insights delivered straight to your IDE or CLI
  • Works where you do: dev, QA, staging, CI/CD, and production

The most common issues for Puppeteer – Puppeteer are:

 

[Bug]: Missing X server or $DISPLAY

 

Despite launching Chromium via the RDP Terminal or a remote SSH with DISPLAY set to :10.0, Puppeteer still produced an error on both occasions; thus indicating that it is using different methods for invoking Chrome/Chromium in Ubuntu 22.04. Further investigation revealed a variable of ‘env?: Record<string, string | undefined>’; offering potential insight as to why this discrepancy was occurring. The following used the problem:

puppeteer.launch(
    ...,
    env: {
        ...,
        DISPLAY: ":10.0"
    }
)

 

[Bug] Error: An `executablePath` or `channel` must be specified for `puppeteer-core`

 

Applying this strategy proved successful:

import { executablePath } from 'puppeteer';
import puppeteer from 'puppeteer-extra';

  const browser = await puppeteer.launch({
    headless: true,
    executablePath: executablePath(),
  });

 

The chromium binary is not available for arm64

 

Chromium binaries are available for arm64 architecture at www.chromiumforlambda.com

 

Headless PDF printing inconsistent page width and height

 

There are a few reasons why the page width and height of a PDF generated using Puppeteer’s page.pdf() method might be inconsistent:

  1. The page size might not be set consistently. By default, the page size is set to 8.5 x 11 inches (letter size), but you can use the page.pdf({ width, height }) options to specify a different page size. If you are setting the page size dynamically, make sure to set it consistently for all pages.
  2. The content of the page might not be consistent. If the content of the page is not the same on all pages, the page width and height might also vary. Make sure that the content of the page is consistent across all pages.
  3. The page zoom level might not be consistent. If the page zoom level is not the same on all pages, the page width and height might also vary. You can set the zoom level using the page.zoomFactor property, or use the page.setViewport() method to set the viewport size and zoom level at the same time.
  4. The page margins might not be consistent. If the page margins are not the same on all pages, the page width and height might also vary. You can set the page margins using the page.pdf({ margin }) option.

To troubleshoot inconsistent page width and height, you can try setting the page size, zoom level, and margins consistently, and checking the content of the page to ensure that it is the same on all pages.

 

[Bug]: Running puppeteer on docker alpine on Mac failed

 

There are a few possible reasons why running Puppeteer on Docker Alpine on Mac might fail:

  1. The version of Node.js on the Alpine image might not be compatible with Puppeteer. Puppeteer has specific version requirements for Node.js, and if the version on the Alpine image is not compatible, Puppeteer might not work.
  2. The version of Chrome or Chromium on the Alpine image might not be compatible with Puppeteer. Puppeteer has specific version requirements for Chrome or Chromium, and if the version on the Alpine image is not compatible, Puppeteer might not work.
  3. The Alpine image might not have the necessary dependencies installed to run Puppeteer. Puppeteer has a number of dependencies that need to be installed on the system in order to work properly, such as libgconf-2-4 and libnss3. Make sure that these dependencies are installed on the Alpine image.
  4. There might be issues with file permissions on the Alpine image. Puppeteer requires access to certain files and directories on the system in order to run, and if it does not have the necessary permissions, it might fail. Make sure that Puppeteer has the necessary permissions to access the necessary files and directories on the Alpine image.

To troubleshoot the issue, you can try the following:

  1. Check the version of Node.js and Chrome or Chromium on the Alpine image and make sure that they are compatible with Puppeteer.
  2. Check that the necessary dependencies are installed on the Alpine image.
  3. Check the file permissions on the Alpine image and make sure that Puppeteer has the necessary permissions to access the necessary files and directories.
  4. Try running Puppeteer on a different image or system to see if the issue persists.

 

Feature: Simpler way to handle pages created on clicking a[target=”_blank”]; wait for loading and include timeouts

 

With clear, uncomplicated steps, the task at hand has been reduced to its simplest form.

const pageTarget = this._page.target(); //save this to know that this was the opener
await resultItem.element.click(); //click on a link
const newTarget = await this._browser.waitForTarget(target => target.opener() === pageTarget); //check that you opened this page, rather than just checking the url
const newPage = await newTarget.page(); //get the page object
// await newPage.once("load",()=>{}); //this doesn't work; wait till page is loaded
await newPage.waitForSelector("body"); //wait for page to be loaded
Share

It’s Really not that Complicated.

You can actually understand what’s going on inside your live applications. It’s a registration form away.

Get Lightrun

Lets Talk!

Looking for more information about Lightrun and debugging?
We’d love to hear from you!
Drop us a line and we’ll get back to you shortly.

By submitting this form, I agree to Lightrun’s Privacy Policy and Terms of Use.