I don't actually want to trigger an event. I just want to find out programmatically which element will handle the onmousedown if the mouse is clicked at position x/y.
The purpose is to then add an interceptor to that element which point-event: none
// without pointer-events: none;
const element = document.elementFromPoint(mouseX, mouseY);
function elementsFromPoint(x, y) { // pointer-events: none;
const elements = document.body.getElementsByTagName("*");
var elementsList = Array.prototype.slice.call(elements);
var results = []
elementsList.forEach(element => {
var rect = element.getBoundingClientRect();
if (rect.left < x && x < rect.right && rect.top < y && y < rect.bottom) {
results.push(element)
}
});
return results;
}
window.addEventListener('load', () => {
const textarea = document.querySelector('#text')
document.addEventListener('click', (e) => {
const element = elementsFromPoint(e.clientX, e.clientY);
console.log(element)
})
})
pointer-events: none
event.targetdirectly gives the clicked item. ....