How do I create a listener that listens for every type of event [duplicate]

Question

This question already has answers here:

How can I bind all events on a DOM element? (7 answers)

Closed 8 years ago.

This is purely for debugging purposes. Is there a single command like

addEventListener('*', myHandler) 

in native js or

$(document).on('*', myHandler)

in jQuery that would listen for any event no matter what type or namespace and call myHandler when an event happens?

Or is there something in the browser's own devtools that might let you see all the events?

Answer 1

Chrome's dev tools can do this. Open them up, go to the Sources tab, and look in the right-hand column with the expandable/collapsible sub-panes. Expand the one called Event Listener Breakpoints. Under here are expandable checkbox selections that allow you to tick any events that you wish to listen for. Once you check any of them, Chrome will break in JS code as soon as an event of that type occurs.

Assuming your myHandler function contains code you just want to execute for debugging, you can just run this code in the console, or call the function via console.