This is how I would debug that, in Firebug, purely through the console:
Download Firebug 1.12b1 or later, which has a
getEventListeners
command line API function (Chrome also has this).Select the element in the HTML panel, to make it available as
$0
.getEventListeners($0)
--> Object { click=[1], mousedown=[1], remove=[1]}(Ah, so it has a mousedown listener. Nice.)
getEventListeners($0).mousedown[0].listener + ""
--> "function (e){return typeof jQuery!==core_strundefined&&(!e||jQuery.event.triggered!==e.type)?jQuery.event.dispatch.apply(eventHandle.elem,arguments):undefined;}"(Internal jQuery wrapper. Let's go around that.)
$._data($0, 'events')
--> Object { remove=[1], mousedown=[1], click=[1]}f = $._data($0, 'events').mousedown[0].handler
f + ""
--> "function (e){return t._mouseDown(e)}"(Hm.
t
doesn't look to be a global, but we can use Firebug's (very non-standard) closure accessor syntax to work around that.)f.%t._mouseDown + ""
--> "function (){var i,s=this._super,a=this._superApply;return this._super=e,this._superApply=t,i=n.apply(this,arguments),this._super=s,this._superApply=a,i}"f.%._mouseDown.%n + ""
-> ... some huge pile of code, which finally looks relevant.
At some point it should be possible to stop the process and start setting breakpoints instead, dragging the logo, and then stepping into the relevant code, but this console-only process feels very straight-forward to me, after I've gotten used to it.
In Chrome almost the same method should be applicable, except that the .%
syntax would have to be replaced with expanding objects in the console, and clicking on <function scope>
. Sadly it is not then possible the play with the functions in the console, but you can still get through to the wanted function to set breakpoints in it. (Side note: Firebug's equivalent to this is opening the objects in the DOM panel, checking the latter's "Show Closures" option, and expanding "(closure)". You can then get back to the console by right-click -> "use in command line", but it's still more clumsy than the alternative, IMO.)
Another method for Chrome is to go to the "Sources" panel, setting an "Event Listener Breakpoint" for "mousedown", clicking the logo, and then stepping into/over until you hit the wanted function (preferably with pretty printing enabled - use the {} icon at the bottom). This might be easier. :)
Or if you actually asked which piece of code added the event listener there: the easiest way is by inspection of the code around the functions we just found. Breakpoints in the libraries' add-event-listener functions would also work.