Track Event Listeners

track.js

(function(window, document) {
  'use strict';
  /* global getEventListeners */

  window.listenerCount = 0;

  var ael = Node.prototype.addEventListener;
  Node.prototype.addEventListener = function() {
    window.listenerCount++;
    window.console.log('add', arguments);

    ael.apply(this, arguments);
  };
  var rel = Node.prototype.removeEventListener;
  Node.prototype.removeEventListener = function() {
    window.listenerCount--;
    window.console.log('remove', arguments);

    rel.apply(this, arguments);
  };

  window.findEventListeners = function() {
    var items = Array.prototype.slice.call(
      document.querySelectorAll('*')
    ).map(function(element) {
      var listeners = getEventListeners(element);
      return {
        element: element,
        listeners: Object.keys(listeners).map(function(k) {
          return {
            event: k,
            listeners: listeners[k]
          };
        })
      };
    }).filter(function(item) {
      return item.listeners.length;
    });

    items.map(function(item) {
      var el = item.element,
        id = el.id,
        className = el.className;

      if (className instanceof SVGAnimatedString) {
        className = className.baseVal;
      }

      var str = el.tagName.toLowerCase() +
        (id ? '#' + id : '') +
        (className ? '.' + className.replace(/\s+/g, '.') : '');

      str += ' ' +
        item.listeners.map(function(l) {
          return l.event + ': ' + l.listeners.length;
        }).join(', ');
      return str;
    }).join('\n');

    return items;
  };
})(this, document);

usage.js

// number of event listeners
listenerCount;

// Find elements with event listeners attached
findEventListeners();

// Highlight elements with listeners attached
findEventListeners().map(function(item) { item.element.style.outline = '2px solid red'; });