使用puppeteer时等待文本出现

Question

我想知道是否有类似于selenium的方式来等待文本出现在特定元素中.我尝试过类似的东西,但它似乎没有等待:

await page.waitForSelector('.count', {visible: true});

Answer 1

你可以用waitForFunction.请参阅https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagewaitforfunctionpagefunction-options-args

包括@ elena的答案完整性解决方案:

await page.waitForFunction('document.querySelector(".count").inner??Text.length == 7');

Answer 2

除了 nilobarp 的回答中提出的方法外，还有两种方法可以做到这一点：

page.waitForSelector

使用伪选择器:empty可以找到不包含子节点或文本的元素。将此与:not选择器结合使用，我们可以使用page.waitForSelector查询非空的选择器：

await page.waitForSelector('.count:not(:empty)');

XPath 表达式

如果您不仅要确保元素不为空，还要检查它包含的文本，您可以使用 XPath 表达式page.waitForX：

await page.waitForXPath("//*[@class='count' and contains(., 'Expected text')]");

此行仅在页面上存在具有属性class="count"并包含文本的元素后才会解析Expected text。

Answer 3

您可以使用的最佳解决方案waitForFunction()（避免使用奇怪的函数作为字符串）：

const selector = '.count';
await page.waitForFunction(
    selector => document.querySelector(selector).value.length > 0,
    {},
    selector
);

根据文本类型，替换value为innerText。

检查puppeteer API