I type this code to the browser console:
document.body.addEventListener("click", () => {
Promise.resolve().then(() => console.log(1));
console.log(2);
}, false);
document.body.addEventListener("click", () => {
Promise.resolve().then(() => console.log(3));
console.log(4);
}, false);
These two event listeners listen the click event and print numbers.
then I wrote a line to execute this statement:
document.body.click();
Meets my expectations, the result is:
2
4
1
3
But then, I click the screen, the event callbacks are triggered with this result:
2
1
4
3
Why does clicking on the screen and executing the body.click()
manually make different results?