Firefox extension to find out which Javascript event is bound to an inspected element?

Question

One can bind Javascript events to html elements without using inline declarations.

Is there a way when inspecting an html element to know which events are bound to the element? I want to know about the events defined by the developer and not the internal ones that come with the browser.

So if I hover over an element and a menu shows up, I want to know which method caused it.

I have been trying Event Spy with the Code inspector but it logs too many of the internal ones, unless I am not using it right.

Answer 1

Visual event 2

_{(source: tinygrab.com)}

Visual Event is an open source Javascript bookmarklet which provides debugging information about events that have been attached to DOM elements.

Answer 2

There's no way to enumerate listeners added with addEventListener in Firefox core (bug 448602).

There may be workarounds, but I'm not aware of any. See also How to find event listeners on a DOM node when debugging or from the JavaScript code?

[edit] Oh wait, determine "which events are bound"? Did you mean which events can fire on the node? If so, you should clarify your question.

Answer 3

From Firefox 33 this feature is added to inspector in firefox-developer-tools. You can see 'ev' or 'event' icon next to elements which have event listeners. Clicking that displays a listing of all the event listeners bound to the element.

MDN - Examine Event Listeners