Save Event Targets

SaveEventTargets.js

const interestingEventTypes = [ 'pointerdown', 'pointerup', 'click', 'keydown', 'keypress', 'keyup'];
const mapOfTargets = Object.fromEntries(interestingEventTypes.map(type => [type, {}]));

interestingEventTypes.forEach(type =>
  document.addEventListener(type, (event) => {

    // TODO: Improve this
    const nodeType = event.target.nodeName.toLowerCase();
    const nodeId = event.target.id;
    const nodeClasses = event.target.className.replace(/\s/g, '.');
    const targetSelector = `${nodeType}#${nodeId}.${nodeClasses}`;
      
    mapOfTargets[type][event.timeStamp] = targetSelector;
  })
);

new PerformanceObserver(list => {
    for (let entry of list.getEntries()) {
        if (!interestingEventTypes.includes(entry.name)) continue;

        const targetSelector = mapOfTargets[entry.name][entry.startTime];
        console.log(targetSelector, entry);
    }
}).observe({
    type: 'event',
    durationThreshold: 0
});