Skip to content

Commit

Permalink
Test order of toggle events in addition to order of DOMSubtreeModifie…
Browse files Browse the repository at this point in the history
…d events.

I realized while writing
whatwg/html#9400 (comment) that the
ordering of the `open` attribute manipulation is also exposed through
`toggle` events, so this tests those events in addition to
`DOMSubtreeModified` events.

Bug: 1444057
Change-Id: I6d3c65f5402053d77e4f6c488aa07209181a8cdd
  • Loading branch information
dbaron authored and chromium-wpt-export-bot committed Jun 7, 2023
1 parent dcf2cd7 commit 0fc793e
Showing 1 changed file with 37 additions and 25 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -110,24 +110,7 @@
assert_element_states(elements, [1, 0, 0, 1, 0, 1, 0, 1], "after final mutation");
}, "mutually exclusive details across multiple names and multiple tree scopes");

// The next two tests test characteristics of the design that are only
// exposed via mutation events. If mutation events (for attribute
// addition/removal) are removed from the web, these tests could be
// removed, and some small simplifications could be made to the code
// implementing this feature.
function mutation_events_for_attribute_removal_supported() {
container.innerHTML = `<div id="event-removal-test"></div>`;
let element = container.firstChild;
let event_fired = false;
element.addEventListener("DOMSubtreeModified", event => event_fired = true);
element.removeAttribute("id");
return event_fired;
}

promise_test(async t => {
if (!mutation_events_for_attribute_removal_supported()) {
return;
}
container.innerHTML = `
<details name="a" id="e0" open></details>
<details name="a" id="e1"></details>
Expand All @@ -143,24 +126,53 @@
document.getElementById("e3") ];
container.insertBefore(e2, elements[3]);

let received_ids = [];
let listener = event => {
let mutation_event_received_ids = [];
let mutation_listener = event => {
assert_equals(event.type, "DOMSubtreeModified");
assert_equals(event.target.nodeType, Node.ELEMENT_NODE);
let element = event.target;
assert_equals(element.localName, "details");
received_ids.push(element.id);
mutation_event_received_ids.push(element.id);
};
let toggle_event_received_ids = [];
let toggle_event_promises = [];
for (let element of elements) {
element.addEventListener("DOMSubtreeModified", listener);
element.addEventListener("DOMSubtreeModified", mutation_listener);
toggle_event_promises.push(new Promise((resolve, reject) => {
element.addEventListener("toggle", event => {
assert_equals(event.type, "toggle");
assert_equals(event.target, element);
toggle_event_received_ids.push(element.id);
resolve(undefined);
});
}));
}
assert_array_equals(received_ids, []);
assert_array_equals(mutation_event_received_ids, []);
assert_element_states(elements, [1, 0, 1, 1], "states before mutation");
elements[1].open = true;
assert_array_equals(received_ids, ["e0", "e3", "e2", "e1"],
"removal events received in node insertion order, followed by addition event");
if (mutation_event_received_ids.length == 0) {
assert_true(true, "ok if mutation events are not supported");
} else {
assert_array_equals(mutation_event_received_ids, ["e0", "e3", "e2", "e1"],
"removal events received in node insertion order, followed by addition event");
}
assert_element_states(elements, [0, 1, 0, 0], "states after mutation");
}, "mutation event order matches order of insertion in set of named elements");
assert_array_equals(toggle_event_received_ids, [], "toggle events received before awaiting promises");
await Promise.all(toggle_event_promises);
assert_array_equals(toggle_event_received_ids, ["e1", "e0", "e3", "e2"], "toggle events received after awaiting promises");
}, "mutation event and toggle event order matches order of insertion in set of named elements");

// The next test is only relevant because of mutation events. If mutation
// events (for attribute addition/removal) are removed from the web, this test
// could be removed.
function mutation_events_for_attribute_removal_supported() {
container.innerHTML = `<div id="event-removal-test"></div>`;
let element = container.firstChild;
let event_fired = false;
element.addEventListener("DOMSubtreeModified", event => event_fired = true);
element.removeAttribute("id");
return event_fired;
}

promise_test(async t => {
if (!mutation_events_for_attribute_removal_supported()) {
Expand Down

0 comments on commit 0fc793e

Please sign in to comment.