Puppeteer's chromium opens with error and halts puppeteer script

Question

I'm trying to set up puppeteer on my system. I've followed many different tutorials and guides but I keep encountering this problem. Chromium doesn't seem to open up correctly. The following is based on a sample test from one of the guides I've followed.

Error I get from chromium:

Error message on the CLI:

(node:17168) UnhandledPromiseRejectionWarning: Error: Page crashed!
    at Page._onTargetCrashed (C:\Users\dgros\Documents\Git\test\pup\node_modules\puppeteer\lib\Page.js:215:24)
    at CDPSession.Page.client.on.event (C:\Users\dgros\Documents\Git\test\pup\node_modules\puppeteer\lib\Page.js:123:56)
    at CDPSession.emit (events.js:198:13)
    at CDPSession._onMessage (C:\Users\dgros\Documents\Git\test\pup\node_modules\puppeteer\lib\Connection.js:200:12)
    at Connection._onMessage (C:\Users\dgros\Documents\Git\test\pup\node_modules\puppeteer\lib\Connection.js:112:17)
    at WebSocketTransport._ws.addEventListener.event (C:\Users\dgros\Documents\Git\test\pup\node_modules\puppeteer\lib\WebSocketTransport.js:44:24)
    at WebSocket.onMessage (C:\Users\dgros\Documents\Git\test\pup\node_modules\ws\lib\event-target.js:120:16)
    at WebSocket.emit (events.js:198:13)
    at Receiver.receiverOnMessage (C:\Users\dgros\Documents\Git\test\pup\node_modules\ws\lib\websocket.js:789:20)
    at Receiver.emit (events.js:198:13)
(node:17168) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function wit
hout a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:17168) [DEP0018] DeprecationWarning: Unhandled promise 

The guide I followed comes from: https://www.youtube.com/watch?v=IvaJ5n5xFqU

I have installed version 10.16.0 of node.js and version 1.19.0 of puppeteer

I installed puppeteer with:

npm i puppeteer

Sample test which I ran from Git Bash with the command: "node index.js":

const puppeteer = require('puppeteer');

(async function main() {
    try {

        const browser = await puppeteer.launch({ headless: false, ignoreDefaultArgs: ['--disable-extensions'], devtools: true});
        const page = await browser.newPage();

        page.setUserAgent('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36')

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

        await page.waitForNavigation();

        console.log('its showing');

    } catch (e) {
        console.log('our error', e);
    }
})();

The same error is produced with:

const puppeteer = require('puppeteer');

(async function main() {
    try {
        const browser = await puppeteer.launch({ headless: false, ignoreDefaultArgs: ['--disable-extensions'], devtools: true});
        const page = await browser.newPage();

    } catch (e) {
        console.log('our error', e);
    }
})();

When I omit the line with "browser.newPage()" the chromium "Aw, Snap!" error remains, but the UnhandledPromiseRejectionWarning error message goes away.

Expected: chromium opens, navigates to 'https://experts.shopify.com', waits for it to load, and then prints 'its showing' to the Git Bash CLI.

Actual: chromium opens with error and an error message outputs to the Git Bash CLI, nothing else happens.

Why is chromium opening with an error? How do I have the script run and act as expected?

Answer 1

It seems that your problem may be caused by an async orchestration problem (see issue and issue).

In order to solve this problem you can try using one of these two solutions:

Solution 1

await Promise.all([
    page.goto('https://experts.shopify.com'),
    page.waitForNavigation()
]);

Solution 2

const waitForNavigation = page.waitForNavigation();
await page.goto('https://experts.shopify.com');
await waitForNavigation;

Hope it helps!