This has been incorporated in a small library.
Last active
July 29, 2021 08:41
-
Star
(114)
You must be signed in to star a gist -
Fork
(23)
You must be signed in to fork a gist
-
-
Save danburzo/9254630 to your computer and use it in GitHub Desktop.
Get all event listeners on the page in Google Chrome
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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; | |
}); | |
// See below for things you can do with the items |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Things you can do with the items | |
// 1. log them to the console | |
console.log(items); | |
// 2. Put a red border around the elements | |
items.forEach(function(item) { | |
item.element.style.outline = '1px solid red'; | |
}) | |
// 3. generate a summary | |
var summary = .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'); | |
console.log(summary); |
how to get all events on window itself? Right now I have:
['click', 'keyup', 'dragstart', 'dragend'].forEach(function (name) {
window.addEventListener(name, function (ev) {
console.log(name + ' event captured by content script:', ev);
port.postMessage(name);
});
});
but it would be nice to access a complete list of events programmatically (not hardcoded)
Very cool!
Just to mention, this js script works in the console and not in script tag or script file in an html page.
@xxammuxx - Do you have any example where it doesn't seem to be working? Would be great if you can share a jsfiddle snippet.
https://codepen.io/azaslavsky/pres/sybfE
From the codepen author:
"...all of the major browsers have decided against supporting getEventListeners. Only Chrome supports it from the command line"
👍 Thank you! :D
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I'd also suggest, for sanity's sake, to add a little .sort() right before map, like so:
listeners: Object.keys(listeners).sort().map(key => {
Haven't tested with that ES6 mod but with OP's worked fine.