Get event listeners attached to node using addEventListener

Question

I have already looked at these questions    How to find event listeners on a DOM node when debugging or from the JavaScript code  can I programmatically examine and modify Javascript event handlers on html elements  How to debug JavaScript jQuery event bindings with Firebug  or similar tool    however none of them answers how to get a list of event listeners attached to a node using addEventListener  without modifying the addEventListener prototype before the event listeners are created   VisualEvent doesn t display all event listener  iphone specific ones  and I want to do this  somewhat  programmatically

User · Answer

You can obtain all jQuery events using    data     selector    0   events    change  selector  to what you need    There is a plugin that gather all events attached by jQuery called eventsReport   Also i write my own plugin that do this with better formatting    But anyway it seems we can t gather events added by addEventListener method  May be we can wrap addEventListener call to store events added after our wrap call    It seems the best way to see events added to an element with dev tools    But you will not see delegated events there  So there we need jQuery eventsReport   UPDATE  NOW We CAN see events added by addEventListener method SEE RIGHT ANSWER TO THIS QUESTION

User · Answer

Chrome DevTools  Safari Inspector and Firebug support getEventListeners node

User · Answer

I can t find a way to do this with code  but in stock Firefox 64  events are listed next to each HTML entity in the Developer Tools Inspector as noted on MDN s Examine Event Listeners page and as demonstrated in this image

User · Answer

You can t  The only way to get a list of all event listeners attached to a node is to intercept the listener attachment call  DOM4 addEventListener Says  Append an event listener to the associated list of event listeners with type set to type  listener set to listener  and capture set to capture  unless there already is an event listener in that list with the same type  listener  and capture   Meaning that an event listener is added to the  quot list of event listeners quot   That s all  There is no notion of what this list should be nor how you should access it

User · Answer

Since there is no native way to do this  Here is less intrusive solution i found  dont add any  old  prototype methods     var ListenerTracker new function        var is active false         listener tracking datas     var  elements            var  listeners           this init function            if  is active    avoid duplicate call             intercep events listeners                      is active true                register individual element an returns its corresponding listeners     var register element function element           if  elements  indexOf element   -1                  NB   split by useCapture to make listener easier to find when removing             var elt listeners     useCapture false       useCapture true                   elements  push element                listeners  push elt listeners                     return  listeners   elements  indexOf element               var intercep events listeners   function               backup overrided methods         var  super                 addEventListener         HTMLElement prototype addEventListener               removeEventListener      HTMLElement prototype removeEventListener                     Element prototype  addEventListener   function type  listener  useCapture               var listeners register element this                  add event before to avoid registering if an error is thrown              super   addEventListener   apply this arguments                  adapt to  elt listeners  index             useCapture useCapture 1 0               if  listeners useCapture  type  listeners useCapture  type                  listeners useCapture  type  push listener                      Element prototype  removeEventListener   function type  listener  useCapture               var listeners register element this                  add event before to avoid registering if an error is thrown              super   removeEventListener   apply this arguments                  adapt to  elt listeners  index             useCapture useCapture 1 0              if  listeners useCapture  type  return              var lid   listeners useCapture  type  indexOf listener               if lid gt -1 listeners useCapture  type  splice lid 1                      Element prototype  getEventListeners   function type               var listeners register element this                  convert to listener datas list             var result                 for var useCapture 0 list list listeners useCapture  useCapture                     if typeof type    string      filtered by type                     if list type                            for var id in list type                                result push   type  type  listener  list type  id   useCapture    useCapture                                                                     else    all                     for var  type in list                           for var id in list  type                                result push   type   type  listener  list  type  id   useCapture    useCapture                                                                                                return result                         ListenerTracker init

[javascript] Get event listeners attached to node using addEventListener

Examples related to javascript

Examples related to dom-events