Disparity in loadend event dispatch between spec, implementation & tests

[lucacasonato]

Disclaimer: I might be wrong!

According to the spec, the loadend event is synchronously fired right after the load event is dispatched. This all happens inside a single "queue a task". This means that the load and loadend events should be fired in the same turn of the event loop. There is no separate "queue a task" for the dispatching of the loadend event.

The WPT test for this does not agree however. It tests that the loadend event is dispatched one turn of the event loop later (note the await point between eventWatcher.wait_for('load') and eventWatcher.wait_for('loadend')):

  // wpt/FileAPI/reading-data-section/filereader_events.any.js
  var reader = new FileReader();
  var eventWatcher = new EventWatcher(t, reader, ['loadstart', 'progress', 'abort', 'error', 'load', 'loadend']);
  reader.readAsText(new Blob(['a']));
  await eventWatcher.wait_for('loadstart');
  await eventWatcher.wait_for('progress');
  await eventWatcher.wait_for('load');
  await eventWatcher.wait_for('loadend');

The test that would agree with spec behaviour would be the following:

  var reader = new FileReader();
  var eventWatcher = new EventWatcher(t, reader, ['loadstart', 'progress', 'abort', 'error', 'load', 'loadend']);
  reader.readAsText(new Blob(['a']));
  await eventWatcher.wait_for('loadstart');
  await eventWatcher.wait_for('progress');
  await eventWatcher.wait_for(['load', 'loadend']);

All of Chrome, Firefox and Safari implement this according to the current WPT test: https://wpt.fyi/results/FileAPI/reading-data-section/filereader_events.any.html?label=master&label=experimental&product=chrome&product=firefox&product=safari&aligned

So my question: as all browsers agree to disagree here, should the spec be updated? Alternatively I can file issues with all vendors to get this aligned to spec (and correct the test).

[lucacasonato]

Actually, nevermind. I guess microtasks are run after every event dispatch...

[lucacasonato]

Actually, no they are not:

const target = new EventTarget()
target.addEventListener("f", () => {
    console.log("f");
    queueMicrotask(() => console.log("f mt"));
});
target.addEventListener("x", () => {
    console.log("x");
    queueMicrotask(() => console.log("x mt"));
});
target.dispatchEvent(new Event("f"));
target.dispatchEvent(new Event("x"));

[domenic]

Microtasks run whenever the call stack is empty of JS code. See the latter parts of https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/

[lucacasonato]

Deeper digging has revealed Deno bugs. Thanks for the input @domenic :-)