最佳实践 puppeteer waitForSelector or setTimeout

Question

我试图找到"等到加载完整网站"的最佳方法。这似乎是一件棘手的事情。我在谷歌上搜索了很多，发现有两种方法：waitForSelector 和 SetTimout。

我的问题是，即使我等待选择器 #CheckSelectAll 选中此复选框，似乎也总是为时过早。所以我不得不添加 2 秒的延迟。这对我来说看起来很不专业。我想为此使用最佳实践。

这应该是每个人在使用具有不同页面和表单的木偶师时始终需要的问题。

当选择器位于 iFrame 内时，此等待选择器是否有可能不起作用？

感谢您的任何建议和帮助！

  function delay(time) {
    return new Promise(function(resolve) { 
        setTimeout(resolve, time)
    });
  await page.waitForSelector('#CheckSelectAll');
  await delay(2000);
  await page.click('#CheckSelectAll');

Answer 1

如果你想让它成为真正的"木偶师"方式，看看这个。
有几个选项可供选择，但在我的实践中，我找到了最有用的networkidle2。
如文档中所述，您的脚本将等到

至少 500 毫秒的网络连接不超过 2 个。

await page.waitForNavigation({ waitUntil: 'networkidle2' })

但是，如果由于某种原因内置解决方案无法处理您的情况，则可以像您一样制作自定义等待功能。
这是很好的一行，可以编写更少的代码：
await new Promise(resolve => setTimeout(resolve, 2000))

最后一个选项，您可以使用page.evaluate()访问 DOM 并验证元素是否可见。

const visibleVerification = await page.evaluate(() => { 
   // your verify logic.
   // return boolean, if element exists on page
   return true;
})