Is dispatchEvent a sync or an async function

Anz picture Anz · Mar 7, 2013 · Viewed 7.1k times · Source

I am trying to write an event handler for a custom event in WinJS. I am not too sure how this works in IE - I am creating a custom event and dispatching it -

var eventObject = document.createEvent("CustomEvent");
eventObject.initCustomEvent("dropbomb", true, true, null);
this._element.dispatchEvent(eventObject);

My handler is -

this._element.addEventListener("logtelemetry", function () {
                console.log("boom");
});

Can I be certain that the handler will be called in sync and not at a later time? If so then what is the proof.

Answer

jaredjacobs picture jaredjacobs · Apr 8, 2014

It’s guaranteed to be synchronous because:

The return value of dispatchEvent indicates whether any of the listeners which handled the event called preventDefault.

Since the return value indicates whether any of the listeners that handled the event called preventDefault, the method must block (not return) until all of the listeners are done executing, which is the definition of a synchronous call.

The above quotation is an excerpt from the dispatchEvent specification in DOM Level 2 Events, which achieved “Recommendation” status (a standard) back in November 2000. Internet Explorer has complied with this standard since at least IE 9.

To verify for yourself, add a console.log statement immediately after your .dispatchEvent call and notice that "boom" (from your event handler) is always logged first.