puppeteer page.evaluate() randomly fails with: Execution context was destroyed, most likely because of a navigation

Question

The following code randomly fails with:

Execution context was destroyed, most likely because of navigation.

Why is that? Any workarounds?

I use puppeteer version 1.19.0

Note: I'm looking for a general solution that allows navigating to both pages that have redirects, and pages that don't.

const puppeteer = require("puppeteer");

(async () => {
  const browser = await puppeteer.launch();

  try {
    const page = await browser.newPage();

    await page.setCacheEnabled(false);

    const response = await page.goto("https://docs.cypress.io/", {
      waitUntil: "networkidle0",
      timeout: 60000
    });

    const pageUrls = await page.evaluate(() => {
      const links = Array.from(document.querySelectorAll("a"));

      return links.map(link => link.href);
    });

    console.log({ pageUrls });
  } catch (error) {
    console.log(error.message);
  }

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

Answer 1

As a Workarounds - Add below code

await page.waitForNavigation()

after calling page.goto() Or if same issue occurs for page.click() you can wait for navigation using above method.

const puppeteer = require("puppeteer");

(async () => {
  const browser = await puppeteer.launch();

  try {
    const page = await browser.newPage();

    await page.setCacheEnabled(false);

    const response = await page.goto("https://docs.cypress.io/", {
      waitUntil: "networkidle0",
      timeout: 60000
    });

    await page.waitForNavigation();

    const pageUrls = await page.evaluate(() => {
      const links = Array.from(document.querySelectorAll("a"));

      return links.map(link => link.href);
    });

    console.log({ pageUrls });
  } catch (error) {
    console.log(error.message);
  }

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

Output :

{ pageUrls:
   [ 'https://twitter.com/amirrustam',
     'https://www.componentsconf.com.au/workshops',
     'https://www.cypress.io/',
     'https://docs.cypress.io/guides/overview/why-cypress.html',
     'https://docs.cypress.io/api/api/table-of-contents.html',
     'https://docs.cypress.io/plugins/',
     'https://docs.cypress.io/examples/examples/recipes.html',
     'https://docs.cypress.io/faq/questions/using-cypress-faq.html',.................]

Edit

const puppeteer = require("puppeteer");

(async () => {
    const browser = await puppeteer.launch();
    try {
        const page = await browser.newPage();
        await page.setCacheEnabled(false);

        await Promise.all([
            page.waitForNavigation({ timeout: 60000 }),
            page.goto("https://www.google.com/", {
                waitUntil: "networkidle0",
                timeout: 60000
            })
        ])

        const pageUrls = await page.evaluate(() => {
            const links = Array.from(document.querySelectorAll("a"));
            return links.map(link => link.href);
        });
        console.log({ pageUrls });
    } catch (error) {
        console.log(error.message);
    }
    await browser.close();
})();

Output:

{ pageUrls:
   [ 'https://mail.google.com/mail/?tab=wm&ogbl',
     'https://www.google.co.in/imghp?hl=en&tab=wi&ogbl',
     'https://www.google.co.in/intl/en/about/products?tab=wh',
     'https://accounts.google.com/ServiceLogin?hl=en&passive=true&continue=https://www.google.com/',
     'https://www.google.com/#',............