CODEWITHSUNDEEP
javascriptnode.jspuppeteer
hretic
hretic

Reputation: 1085

how to debug a page that wont open (blank page)

here is how i open tabs 

    await page.goto( url , {timeout: 90000} )
        .catch(function(error){
            page.close();

        }
    );

i open multiple pages in 1 browser in a loop , one particle page (which is the first tab i open) wont open the first time (first loop) and i get timeout error , it works in the next loop just fine ... i tried to capture screen shot and its just a blank page .... i have the same code working fine on

so my question is is there anyway to gather information about why the page wont open ? is it late response or something else ?

Upvotes: 1

Views: 2078

Answers (1)

Grant Miller
Grant Miller

Reputation: 29047

The Puppeteer documentation includes debugging tips, which list:

  1. Turning off headless mode with headless: false to see what the browser is displaying:

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

  2. Slowing down Puppeteer operations using the slowMo option to help see what's going on:

    const browser = await puppeteer.launch({
  headless: false,
  slowMo: 200, // slow down by 200ms
});

  3. Capturing console output:

    page.on('console', msg => {
  console.log('Page Log from Evaluate:', msg.text());
});

await page.evaluate(() => {
  console.log('Current URL:', location.href);
});

  4. Stopping test execution and using a debugger in the browser:

    • Using devtools: true when launching Puppeteer:

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

    • Changing default test timeout:

      jest.setTimeout(100000);                   // Jest
jasmine.DEFAULT_TIMEOUT_INTERVAL = 100000; // Jasmine
this.timeout(100000);                      // Mocha

    • Adding an evaluate statement with debugger inside, or adding debugger to an existing evaluate statement:

      await page.evaluate(() => {
  debugger;
});

  5. Enabling verbose logging:

    # Basic verbose logging
env DEBUG="puppeteer:*" node script.js

# Debug output can be enabled/disabled by namespace
env DEBUG="puppeteer:protocol" node script.js # protocol connection messages
env DEBUG="puppeteer:session" node script.js # protocol session messages (protocol messages to targets)

# Protocol traffic can be rather noisy. This example filters out all Network domain messages
env DEBUG="puppeteer:session" env DEBUG_COLORS=true node script.js 2>&1 | grep -v '"Network'

  6. Debugging Puppeteer (Node.js) code, using ndb or npx:

    • npm install -g ndb
    • Adding a debugger to your Puppeteer (Node.js) code
    • ndb jest or ndb mocha (or npx ndb jest / npx ndb mocha)

You may want to also look into the Puppeteer documentation regarding error handling:

For certain types of errors Puppeteer uses specific error classes. These classes are available via require('puppeteer/Errors').

List of supported classes:

Example Usage:

const { TimeoutError } = require('puppeteer/Errors');

// ...

try {
  await page.waitForSelector('.foo');
} catch (e) {
  if (e instanceof TimeoutError) {
    // Handle TimeoutError here ...
  }
}

Upvotes: 7

Related Questions