Puppeteer waitForSelector 未按预期工作答案

【问题标题】：Puppeteer waitForSelector not working as expectedPuppeteer waitForSelector 未按预期工作
【发布时间】：2021-05-31 17:49:00
【问题描述】：

我有这个简单的代码块：

const BUSINESS = 'lalala';
await page.waitForSelector('#searchboxinput').then(
    page.evaluate( (BUSINESS) => {
        document.querySelector('#searchboxinput').value = BUSINESS
    }, BUSINESS)
 ),

如果我设置等待选择器 -> 那么，我希望 then 在选择器存在时执行，但我得到一个 无法设置'null'的属性值。

所以我理解 document.querySelector('#searchboxinput') == undefined 而我认为它是不可能的，因为它是在 waitForSelector 承诺完成时执行的......

这是一个错误还是我遗漏了什么？

【问题讨论】：

标签： node.js puppeteer

【解决方案1】：

不确定我是否理解正确，因为您的块在语法上不完整且不可重现。但是如果你使用page.waitForSelector() 的返回值呢？这似乎有效：

import puppeteer from 'puppeteer';

const browser = await puppeteer.launch({ headless: false, defaultViewport: null });

try {
  const [page] = await browser.pages();

  await page.goto('https://example.org/');

  const BUSINESS = 'lalala';
  await page.waitForSelector('a').then((element) => {
    page.evaluate((element, BUSINESS) => {
      element.textContent = BUSINESS;
    }, element, BUSINESS);
  });
} catch (err) { console.error(err); }

【讨论】：

是的，确实如此，但我不明白为什么在等待相同的选择器后我无法在浏览器上下文中找到 DOM 元素，除非您使用 waitForSelector 的返回值。我的意思是，此时 DOM 元素不是必须存在吗？
@JoelBonetR 你能提供一个可重现的代码吗？
@JoelBonetR 根据documentation，您可以在选项中定义是否希望选择器出现在 DOM 中或仅在视觉上出现。