JavaScript event log

Question

Is there any way to see which events are being executed with JS.

For example, let's assume I have click event being fired, and then keypress...Now I want to have a log of those fired events.

Is there a way I can get such log of fired events (possibly with function names, but that is optional)?

EDIT: I think I need to add a detail to this. I want to log all events. If there is some custom event that I am not aware of, I want to know its name. For that reason I can not monitor only certain events that I am aware of, but also those that I am not.

EDIT 2: Log should only contain events for elements on which certain listener is attached. E.g. via $('#test-element').on(...) or testElement.addEventListener(...). Again, names of events are unknown (don't have to be click/keypress/...).

Answer 1

Fill Array with listners you want to attach and then log their type;

['click','onkeypress'].forEach( evt => 
        element.addEventListener(evt, log, false)
);

log = (event) => {
    console.log(event.type)
}

Answer 2

You can try this

    var oldListener = EventTarget.prototype.addEventListener;
    EventTarget.prototype.addEventListener = function(type, listener, useCapture, wantsUntrusted ){
        const oldEventHandler = listener;
        listener = function(event){
            EventTarget.log = EventTarget.log || [];
            EventTarget.log.push("day? hour? minute? "+type);
            oldEventHandler(event);
        }
        oldListener.call(this, type, listener, useCapture, wantsUntrusted)
    }

And then type EventTarget.log in console