Puppeteer page.mouse.down() / up() 和点击物理鼠标不一样？

Question

在以下站点，输入诸如“宝贝”之类的搜索短语（试试吧！）后，Puppeteer 调用 page.mouse.down() 与单击并按住物理鼠标的效果不同：https://www.dextools.io/app/bsc

输入搜索词组后，会出现一个伪造的下拉菜单 select，这实际上是一个 UL，我正试图点击第一个搜索结果。所以我使用这样的代码

await page.mouse.move(200, 350); // let's assume this is inside the element I want
await page.mouse.down();
await new Promise((resolve) => setTimeout(resolve, 2000)); // wait 2 secs
await page.mouse.up();

此代码的预期效果是，在 Puppeteer“按住”鼠标按钮的 2 秒内，假下拉菜单保持可见，而当 Puppeteer“释放”鼠标按钮时，站点重定向到项目 selected.

的搜索结果

这正是我使用物理鼠标时发生的情况。

然而，Puppeteer 的情况是，下拉菜单就消失了，就好像我按下了 Escape 键，之后的 page.mouse.up() 命令就不再起作用了。

我知道 PPT 在鼠标、键盘、按住和释放按钮以及修改键方面有一些怪癖，尤其是同时执行上述所有操作时。例如，拖放无法按预期工作，但此处提出的 none 解决方法对我有用：https://github.com/puppeteer/puppeteer/issues/1265

Answer 1

您可以根据 puppeteer docs:

试试这个，而不是两个单独的鼠标按下和向上操作

// selector would uniquely identify the button on your page that you would like to click
selector = '#dropdown-btn'
await page.click(selector, {delay: 2000})

Answer 2

一旦你有了你想要点击的列表元素，你应该在这个元素中寻找第一个 <a> 标签，并使用你在这个 <a> 上的引用来执行点击.

从 puppeteer 的文档中可以看出，如果有您应该使用的导航：

const [response] = await Promise.all([
  page.waitForNavigation(waitOptions),
  page.click(selector, clickOptions),
]);

其中选择器将引用提到的 <a> 标签。

Answer 3

我无法使用此测试脚本重现该问题。单击 link 并使用以下导航：

import puppeteer from 'puppeteer';

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

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

  await page.goto('https://www.dextools.io/app/bsc', { timeout: 0 });

  const input = await page.waitForSelector('.input-container input');
  await input.type('baby');

  const link = await page.waitForSelector('.suggestions-container.is-visible a:not(.text-sponsor)');
  await link.click();
} catch (err) { console.error(err); }

Puppeteer page.mouse.down() / up() 和点击物理鼠标不一样？

Puppeteer page.mouse.down() / up() not the same as clicking physical mouse?

javascript

puppeteer