我没有在 UI 中等待数据加载到下拉列表中的 puppeteer 上获得正确的脚本

Question

我正在使用长时间等待页面延迟 (8000) 只是为了确保下拉框中的所有数据都已加载。我假设必须有一种方法可以等到下拉框中的所有数据都加载完毕，然后自动化进入下一步。

我尝试对选择器使用验证，但我们无法对从查询中填充的动态数据进行验证也尝试使用 await page.delay(n) 但这不是正确的方法，因为有时运行查询可能需要一些时间。

page.click(selectors.xxx.nnn)
    await delay (1000)
    page.keyboard.type('abc')
    await delay(8000)
    page.keyboard.press('ArrowDown')
    page.keyboard.press('ArrowDown')
    page.keyboard.press('Enter')

await page.waitFor(selectors.xxx.nnn)
    page.click(selectors.xxx.nnn)
    await page.waitFor(selectors.xxx.abc)

所以使用延迟可以是一个解决方案，但不是一个合适的解决方案。如果有什么办法可以让浏览器在 puppeteer 等待中自动化，不是为了选择器，而是为了来自后端的数据。最好确保下拉列表中的所有预期列表都已填充并可供选择。

Answer 1

您可以使用 page.waitForFunction 等待特定函数 returns 为真。在您的情况下，您可以计算下拉框的选项。我假设 "dropdown box" 是一个简单的 <select>...</select> HTML 元素。

代码示例

await page.waitForFunction(() => document.querySelector('#id-of-selectbox').length > 0);

由于select框上的length属性returns里面的选项数量，这段代码会等到select里面至少有一个选项框，然后继续。

Answer 2

await page.waitForResponse(response => response.status() === 200)

或

await page.waitForResponse(response => response.ok())

这都允许自动化等待所有响应成功

我没有在 UI 中等待数据加载到下拉列表中的 puppeteer 上获得正确的脚本

I am not getting proper script on puppeteer where in UI waits until the data is loaded in a dropdown

automation

ui-automation

typescript

jestjs

puppeteer