如何在Puppeteer中双击

问题描述

我有一个工作区，可以在其中添加不同的对象。在一种情况下，双击可以将对象自动添加到工作空间中。我经历了不同的解决方案，但没有一个真正起作用。

这是我尝试过的：

useEffect

解决方法

您可以使用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,{ clickCount: 2 });
  } else {
    console.error("Element Not Found");
  }

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

更新

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

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

javascript playwright