通过元素 ID 单击带有 puppeteer 的复选框

Question

我有这个傀儡代码：

(async () => {
  const browser = await puppeteer.launch({ args: ['--no-sandbox'] });
  const page = await browser.newPage();

  await page.goto("https://myurl.com/page");
  await page.waitForSelector("#select-all-checkbox");

  var bodyHTML = await page.content();
  console.log(bodyHTML + "\n\n");

  await page.click("#select-all-checkbox");
  await page.close();
  await browser.close();
})();

将 HTML 记录到控制台，我已经验证了我正在访问的页面具有以下 HTML：

<label><input type="checkbox" name="" id="select-all-checkbox" value="" checked=""><span class="ifaFs"><span data-testid="icon-checkbox-someselected" class="hdDWuD"></span></span></label>

我在page.click行收到此错误：

(node:3827) UnhandledPromiseRejectionWarning: 错误: Node
在 ElementHandle._clickablePoint (/path/to/node_modules/puppeteer/lib/JSHandle.js:217:13)
at process._tickCallback (internal/process /next_tick.js:68:7)
--异步--
在 ElementHandle。(/path/to/node_modules/puppeteer/lib/helper.js:111:15)
at DOMWorld.click (/path/to/node_modules/puppeteer/lib/DOMWorld.js:367:18)
at process._tickCallback (internal /process/next_tick.js:68:7)
--异步--
在帧。(/path/to/node_modules/puppeteer/lib/helper.js:111:15)
在 Page.click (/path/to/node_modules/puppeteer/lib/Page.js:1037:29)

Answer 1

使用上面的代码示例，这就是我解决问题的方法。

(async () => {
  const browser = await puppeteer.launch({ args: ['--no-sandbox'] });
  const page = await browser.newPage();

  await page.goto("https://myurl.com/page");
  await page.waitForSelector("#select-all-checkbox");

  await page.evaluate(() => {
    document.querySelector("#select-all-checkbox").parentElement.click();
  });

  await page.close();
  await browser.close();
})();