鼠标单击事件未按预期工作

Question

我正在尝试在 Whatsapp Web 搜索栏中搜索联系人，首先我想将注意力集中在搜索栏中，然后输入联系人以执行搜索。

我正在选择 div：

const searchBox = document.querySelector("[data-testid=chat-list-search]") // returns div element

searchBox.dispatchEvent(new MouseEvent('click', { bubbles: true })) // returns true

Dispatch 事件返回 true 但在搜索框中无效

Answer 1

您可以只使用element.focus()或element.select() ，哪个更适合目标（如果您可以定位<input>元素而不是div ，那么focus方法可能是更好的选择，因为它会预先选择输入的文本内容）。

如果只想单击元素，可以使用element.click() 。

请注意，在任何情况下，应用程序都可能使用事件侦听器回调，这些回调选择不响应任何未将其event.isTrusted属性设置为true的事件（在这种情况下，无法以编程方式与这些目标通过生成一个事件并分派它——或者换句话说——在像puppeteer这样的环境中不使用本机 API）。