javascript - puppeteer:如何等待 SPA 中的页面?

标签 javascript node.js puppeteer

我正在尝试使用 puppeteer 在 SPA 中导航,我在这里面临的问题是我无法等待页面加载然后继续我的程序。

我填写一个表单,然后点击提交,根据表单的内容,可以加载不同的页面,所以我不能使用 page.waitFor(Selector) 因为可以有很多不同的页面取决于输入。

我尝试使用 waitUntil: load, networkidle2, networkidle0, domcontentloaded 但它们都在加载元素之前触发。

我试图自动化的页面是 Link . (如果您想自己检查,请选择预订引用并随机填写详细信息,然后按继续。)

在链接中选择“预订引用”后,我用 puppeteer 填写详细信息,然后按继续按钮,我无法弄清楚的是如何在不依赖选择器的情况下等待页面完全加载。

最佳答案

我认为您应该知道这些页面是什么,并为每个页面使用 Promise.racepage.waitFor,如下所示:

const puppeteer = require('puppeteer');

const html = `
<html>
  <body>
    <div id="element"></div>
    <button id="button">load</button>

    <script>
      document.getElementById('button').addEventListener("click", () => {
        document.getElementById('element').innerHTML =
          '<div id="element' + (Math.floor(Math.random() * 3) + 1)  + '"></div>';
      });
    </script>
  </body>
</html>`;

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

  await page.click('#button');

  const element = await Promise.race([
    page.waitFor('#element1'),
    page.waitFor('#element2'),
    page.waitFor('#element3')
  ]);

  console.log(await (await element.getProperty('id')).jsonValue());
  await browser.close();
})();

关于javascript - puppeteer:如何等待 SPA 中的页面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49490100/

相关文章:

javascript - 更新 DOM 并发送当前时间

node.js - 想要猴子补丁表达 res.json - 有更好的方法吗?

puppeteer - 如何使用 Puppeteer 粘贴文本?

javascript - mpld3 生成的 html 图例中缺少 xticklabels 和颜色

javascript - 在 createJS/easelJS 中围绕另一个对象旋转一个对象

javascript - 如何在不登录的情况下授权用户访问 FB Messenger 中的网页?

puppeteer - Windows 10 - 运行 puppeteer 脚本会打开一个空白的 Chromium 窗口

node.js - 如何在对话流实现中使用 OR 运算符

javascript - 正则表达式匹配域和子域

javascript - UnhandledPromiseRejectionWarning : Error: Protocol error (Runtime. callFunctionOn) : Target closed. (Puppeteer)