monitorEvents
monitorEvents() allows to observe events from the web browser console for Safari, Chrome and Edge. Firefox doesn't support it. Events will be logged to the console.
You can do:
let main = document.querySelector("#main")
monitorEvents(main, "click") //log click events on #main
unmonitorEvents(main, "click") //stop logging click events on #main
monitorEvents(document.body) //log all events on the body
unmonitorEvents(document.body) //stop logging events on the body
monitorEvents(document.body, ["change", "submit"]) //log change and submit events on the body
Paul Irish pointed out, there are shortcuts for event categories. This is for Chrome Developer Tools in 2012, therefore I'm not sure if it works exactly in the same way for all browsers. A quick check with the mouse category for Safari indicated it could work the same for other browsers.
mousecategory- If the second argument is
mouse, you’ll get allmousedown,mouseup,click,dblclick,mousemove,mouseover,mouseout,mousewheelevents. keycategory- If the second argument is
key, you’ll get allkeydown,keyup,keypress,textInpuevents. touchcategory- If the second argument is ‘touch’, you’ll get all
touchstart,touchmove,touchend,touchcancelevents. (See emulate touch events in devtools settings!) controlcategory- If the second argument is
control, you’ll get allresize,scroll,zoom,focus,blur,select,change,submit,resetevents. - [no event type]
- If you don’t define a second argument, you’ll get all of the above, plus…
load,unload,abort,error,select,change,submit,reset,focus,blur,resize,scroll,search,devicemotion,deviceorientation.
monitor
monitor() allows to observe function calls from the web browser console for Chrome and Edge. Safari and Firefox do not support it.
You can do:
function myFn(); { } //sample function
monitor(myFn); //log function calls for myFn
myFn(); // function myFn called
myFn(1); // function myFn called with arguments: 1
unmonitor(myFn); //stop logging function calls for myFn