Monitor all JavaScript events in the browser console

Question

Is it possible to listen to all javascript events?

I'm trying to guess if there's an event triggered after the DOM is modified by an AJAX request.

Answer 1

With firebug or web inspector you can use monitorEvents:

monitorEvents(myDomElem);

This prints all events emitted by myDomElem to the console. Use unmonitorEvents to stop monitoring events.

If you're interested in getting events after the DOM has been manipulated, take a look at Mutation Events.

Edit:

As far as I know, there is no easy way to intercept all onreadystatechange events from all XMLHttpRequest. The only work-around I can think of is to override the native XMLHttpRequest object with you own implementation. For example:

(function() { // Overriding XMLHttpRequest
    var oldXHR = window.XMLHttpRequest;

    function newXHR() {
        var realXHR = new oldXHR();

        realXHR.addEventListener("readystatechange", function() { 
            console.log("an ajax request was made") 
        }, false);

        return realXHR;
    }

    window.XMLHttpRequest = newXHR;
})();

Needless to say this is extremely hacky and generally ill-advised.