如何在 Puppeteer 中双击

Question

我有一个工作区，我可以在其中添加不同的对象。有一种情况，双击时，可以在工作区中自动添加一个对象。我经历了不同的解决方案，但 none 确实有效。

这是我试过的：

await page.evaluate(selector => {
  var targLink = document.querySelector(selector);
  var clickEvent = document.createEvent('MouseEvents');
  clickEvent.initEvent('dblclick', true, true);
  targLink.dispatchEvent(clickEvent);
}, selector)

Answer 1

您可以使用 mouse.click(x, y[, options]).

先得到x和y.

const selector = "#elementID";

const rect = await page.evaluate((selector) => {
  const element = document.querySelector(selector);
  if (!element) return null;
  const { x, y } = element.getBoundingClientRect();
  return { x, y };
}, selector);

然后传递clickCount作为选项来模拟双击。

await page.mouse.click(rect.x, rect.y, { clickCount: 2 });

完整代码：

const puppeteer = require("puppeteer");

(async () => {
  const browser = await puppeteer.launch();

  const page = await browser.newPage();

  await page.goto("https://www.example.com", {
    waitUntil: "domcontentloaded",
  });

  const selector = "#elementID";

  const rect = await page.evaluate((selector) => {
    const element = document.querySelector(selector);
    if (!element) return null;
    const { x, y } = element.getBoundingClientRect();
    return { x, y };
  }, selector);

  if (rect) {
    await page.mouse.click(rect.x, rect.y, { clickCount: 2 });
  } else {
    console.error("Element Not Found");
  }

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

更新

您可以使用 delay 选项在两次点击之间添加延迟。下面的代码将以 100 毫秒的延迟单击双击元素。

await page.mouse.click(rect.x, rect.y, { clickCount: 2, delay: 100 });

Answer 2

你也可以这样做：

await page.click(selector, { clickCount: 2 });

如前所述here

如何在 Puppeteer 中双击

How to double click in Puppeteer

javascript

puppeteer

playwright