From f53cc112ee987f34d03b7d8ccc667539b596e31d Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Tue, 25 Feb 2025 13:28:34 -0800 Subject: [PATCH] DOM: Add slotchange test for moveBefore() This CL adds a test to ensure that the 'slotchange' event is fired when slots themselves are moved in and out of a custom element, and their assigned nodes change. This addresses https://github.com/whatwg/dom/pull/1307#discussion_r1917435261. R=nrosenthal Bug: 40150299 Change-Id: I93ee04294e5ab3e6d9f75c48705cdc77ce0a1df3 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6298941 Commit-Queue: Dominic Farolino Reviewed-by: Noam Rosenthal Cr-Commit-Position: refs/heads/main@{#1424746} --- .../tentative/slotchange-events.html | 33 +++++++++++++++++++ 1 file changed, 33 insertions(+) diff --git a/dom/nodes/moveBefore/tentative/slotchange-events.html b/dom/nodes/moveBefore/tentative/slotchange-events.html index d30554eba71d7c..eee000f481b402 100644 --- a/dom/nodes/moveBefore/tentative/slotchange-events.html +++ b/dom/nodes/moveBefore/tentative/slotchange-events.html @@ -103,4 +103,37 @@ await slotChangePromise; } }, "Moving a slottable into and out out of a custom element fires 'slotchange' event"); + +promise_test(async t => { + const customElement = document.body.appendChild(document.createElement('custom-element')); + const slot = customElement.shadowRoot.children[0]; + t.add_cleanup(() => customElement.remove()); + + const p = document.createElement('p'); + p.slot = 'content'; + p.textContent = 'The content'; + customElement.appendChild(p); + + // See the above tests that do the same thing, for implementations that do not fire `slotchange` + // at this phase. + await new Promise(resolve => t.step_timeout(() => resolve())); + + assert_array_equals(slot.assignedNodes(), [p]); + document.body.moveBefore(slot, null); + + await new Promise((resolve, reject) => { + slot.addEventListener('slotchange', e => resolve(), {once: true}); + t.step_timeout(() => reject('Timeout; slotchange was not fired2'), 1500); + }); + + assert_array_equals(slot.assignedNodes(), []); + customElement.shadowRoot.moveBefore(slot, null); + + await new Promise((resolve, reject) => { + slot.addEventListener('slotchange', e => resolve(), {once: true}); + t.step_timeout(() => reject('Timeout; slotchange was not fired3'), 1500); + }); + + assert_array_equals(slot.assignedNodes(), [p]); +}, "Moving a slot runs the assign slottables algorithm");