Puppeteer 无法在 page.evaluate 或页面内设置断点。$$eval

Puppeteer cannot breakpoint inside page.evaluate or page.$$eval

使用 Puppeteer 版本:“9.0.0”

不幸的是,在 chrome 开发工具中调试对这个 puppeteer 版本根本不起作用。 所以我使出了NDB。 使用 NDB 我可以在 page.evaluate 函数和 page.$$eval().

之外的任何地方设置断点

运行 带有 ndb 的脚本:

"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "ndb node startscrape.js"
 },

startscrape.js

( async () => {



const browser = await puppeteer.launch(
    {
       
        headless: false,
        defaultViewport:null,
        slowMo: 250,
        devtools:true,
       
    });


        

const page = await browser.newPage();

await page.goto('https://www.google.com');
await page.type('input', 'Here' );
await page.keyboard.press('Enter');
await page.waitForNavigation();


let x = () => {
     debugger;
      console.log('can I debug here?') //YES - breakpoints work upon executing x();

 };

 x();


let xa = await page.evaluate(() => {
    console.log('Alive'); // Logging works in console but cannot breakpoint
    let elements = document.getElementsByClassName('someitem');
    return elements;
});

    // Cannot debug inside here too
// let xa = await page.$$eval('body', (body) => {
//     console.log('Alive');
//     let elements = document.getElementsByClassName('serp-item');
//     return elements;
// });


// breakpoint comes here 
await page.goto('https://www.google.com');


//await browser.waitForTarget(() => false);

  })();

似乎 page.evaluate() 和类似函数参数本身并没有执行:它们的序列化(字符串化)代码从 Node.js 上下文传输到浏览器上下文,然后是一个新函数从该代码重新创建并在那里执行。这就是为什么初始函数中的断点对重新创建的函数没有影响。