首页 > 解决方案 > Puppeteer page.waitForNavigation() 超时错误处理

问题描述

使用 puppeteer,我在输入值时打开一个页面 - 它输出结果。

await page.click('button[class="button form-button rs-gcbalance-btn"]')

await page.waitForSelector('div[class="small-4 large-4 rs-gcbalance-result-num-col').catch(err => console.log(err))

await page.evaluate((card) => {
    console.log(card + " - " + document.querySelectorAll('div[class="small-4 large-4 rs-gcbalance-result-num-col"]')[1].querySelector('span').innerHTML)
}, card)

但只有当输入值有效时才能正常工作。如果不是,它会抛出一个错误,但没有任何网络活动或加载事件。
这意味着,如果值不正确,我正在等待的元素将不会出现并且会抛出错误,关闭程序。

Navigation Timeout Exceeded: 30000ms exceeded

问题是:如何处理错误,所以如果它抛出超时错误,我可以捕获它并调用另一个函数?

标签: javascriptnode.jspuppeteer

解决方案


只需将其包装在try catch块中:

try {
  await page.waitForSelector('#element', { timeout: 1000 });
  // do what you have to do here
} catch (e) {
    console.log('element probably not exists');
}

这是一个完整的工作示例:

const puppeteer = require('puppeteer');

const html = `
<html>
    <body>
        <div id="element">element inner html</div>
    </body>
</html>`;

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto(`data:text/html,${html}`);

  try {
    await page.waitForSelector('#element-not-exists', { timeout: 1000 });
    const element = await page.$('#element-not-exists');
    console.log(await (await element.getProperty('innerHTML')).jsonValue());
  } catch (e) {
    console.log('element probably not exists');
  }
  await browser.close();
})();

推荐阅读