I created this short snippet to check if a handler can be triggered defaultin a javascript event.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script></script>
document.addEventListener('mousedown', function (e){
console.log('mousedown', e);
if (e.target === document.getElementById('target')) {
if (!e.__redispatched) {
e.preventDefault();
e.stopPropagation();
e.stopImmediatePropagation();
var ne = new MouseEvent('mousedown', e);
ne.__redispatched = true;
setTimeout(function (){
e.target.focus();
e.target.dispatchEvent(ne);
}, 1000);
}
}
}, true);
</head>
<body>
<input type="text" id="target"/>
<input type="text"/>
</body>
</html>
I expected the input to targetreceive the event and process it as usual, thus moving the carriage to the correct position (as usual, on mousedown). But nothing happens.
My question is: Am I doing something wrong with dispatchEventor do browsers ignore the default handlers when processing synthetic events? Is there any material / evidence?
Thank.
source
share