获取与 DOM 元素关联的事件列表

Posted 2023-03-07

【中文标题】获取与 DOM 元素关联的事件列表

【英文标题】：get list of events associated with a DOM elements

【发布时间】：2020-09-29 18:38:50

【问题描述】：

在 Firefox 中，可以在开发人员工具的 Inspect Element 中查看与每个元素相关的事件。

我希望以以编程方式列出与之关联的元素和事件。最好使用 selenium+python。

我知道有getEventListeners函数可以在Chrome的开发者工具中使用，但是在Selenium中无法访问。

我浏览了this question 中提供的大部分解决方案，但没有找到可以解决我的问题的方法。

我的最终目标是迭代给定页面的 throw html 元素并执行每个元素的事件。

【问题讨论】：

出于兴趣，这是测试吗？你在测试什么？

@Jacob 好吧，这并不是真正的测试。作为项目的一部分，我需要在每个事件执行后跟踪 DOM 更改。

你能告诉我们页面的网址吗？

为什么不使用 puppeteer？

github.com/puppeteer/puppeteer/issues/…

【参考方案1】：

您可以在一定程度上使用 python + selenium（仅限 Chrome）：

body = driver.execute_cdp_cmd("Runtime.evaluate", "expression": "document.body")
listeners = driver.execute_cdp_cmd("DOMDebugger.getEventListeners", "objectId": body["result"]["objectId"])

【讨论】：

我可以肯定这个解决方案在一定程度上是可行的。例如，它不会检索 React 事件。

【参考方案2】：

未来可能与谁相关！

@pguardiario 提供的 solution 收集了大部分事件，但据我测试此解决方案，React 和 jQuery 没有。

为了克服这个问题并收集React 和jQuery 事件，我深入研究了firefox 源代码，发现firefox 使用了某种parser，以显示React 和jQuery事件，同Visual Events 2解决方案。