Debug puppeteer

elena picture elena · Sep 25, 2017 · Viewed 13.8k times · Source

Is there some way to debug a puppeteer script? One of the buttons just doesn't get clicked for some reason. I've tried all different ways, and actually in another script I get it clicked, but in this one I don't.

await page.focus('#outer-container > nav > span.right > span.search-notification-wrapper > span > form > input[type="text"]');
await page.type("Some text");
await page.click('#outer-container > nav > span.right > span.search-notification-wrapper > span > form'); // I am clicking on the form because it did work in the other script

Answer

Yaniv Efraim picture Yaniv Efraim · Apr 17, 2018

Kind of a late response, but might be helpful as a reference. You could debug your client script like that:

await page.evaluate(() => {
  debugger;
  const btn = document.querySelector(...);
  btn.click();
});

Now just launch puppeteer using:

puppeteer.launch({devtools: true})

Chromium will open and stop on your breakpoint.