My friend Steve Griffith has started an excellent series on dev tools and the browser developer console.
Last week, he released a video on a webkit/blink-only feature (so, MS Edge, Chrome, and Safari, but not Firefox) called
How it works
monitorEvents() method lets you watch for events on an element, and will log the event (and details about it) to the console.
You pass in the element to monitor as an argument. You can optionally specific a specific event to listen for as a second argument.
// This will log all events on the body monitorEvents(document.body); // This will log only click events on the #main element var main = document.querySelector('#main'); monitorEvents(main, 'click');
At any point, you can stop monitoring events with the
Pass in just the element to stop watching all events, or add a second optional argument with the specific event you want to stop monitoring.
// This will stop monitoring all events on the body unmonitorEvents(document.body); // This will stop watching only click events unmonitorEvents(document.body, 'click');
This seems super handy, and I wish I knew about it sooner!