summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/shadow-dom/slot-fallback-content-006.html
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/shadow-dom/slot-fallback-content-006.html')
-rw-r--r--testing/web-platform/tests/shadow-dom/slot-fallback-content-006.html109
1 files changed, 109 insertions, 0 deletions
diff --git a/testing/web-platform/tests/shadow-dom/slot-fallback-content-006.html b/testing/web-platform/tests/shadow-dom/slot-fallback-content-006.html
new file mode 100644
index 0000000000..4708ee7b44
--- /dev/null
+++ b/testing/web-platform/tests/shadow-dom/slot-fallback-content-006.html
@@ -0,0 +1,109 @@
+<!DOCTYPE html>
+<meta charset="utf-8" >
+<meta name="author" title="Di Zhang" href="mailto:dizhangg@chromium.org">
+<meta name="assert" content="Imperatively assigned node overwrites fallback contents, when dynamically created.">
+<title>Shadow DOM: Slots and fallback contents</title>
+<link rel="match" href="slot-fallback-content-006-ref.html">
+
+<p>Test passes if there are two lines of text "B", "A" below.</p>
+
+<div id="host1">
+ <slot id="slot1" name="slot1">FAIL</slot>
+</div>
+<div id="A">A</div>
+<div id="B">B</div>
+
+<p>Test passes if there are two lines of text "D", "C" below.</p>
+
+<div id="host2">
+ <slot id="slot2" name="slot2">FAIL</slot>
+</div>
+<div id="C">C</div>
+<div id="D">D</div>
+
+<p>Test passes if there are two lines of text "F", "E" below.</p>
+
+<div id="host3">
+ <slot id="slot3" name="slot3">FAIL</slot>
+</div>
+<div id="E">E</div>
+<div id="F">F</div>
+
+<p>Test passes if there is one line of text "SLOT4" below.</p>
+
+<div id="host4">
+ <slot id="slot4" name="slot4">SLOT4</slot>
+</div>
+<div id="G">FAIL</div>
+<div id="H">FAIL</div>
+
+<p>Test passes if there is one line of text "SLOT5" below.</p>
+
+<div id="host5">
+ <slot id="slot5" name="slot5">FAIL</slot>
+</div>
+<div id="I">FAIL</div>
+<div id="J">FAIL</div>
+
+<script>
+/*
+1. Append nodes to document.
+2. Assign nodes to slot.
+*/
+const shadowRoot1 = host1.attachShadow({ mode: "open", slotAssignment: 'manual' });
+shadowRoot1.appendChild(slot1);
+const s1 = shadowRoot1.getElementById('slot1');
+host1.append(A, B);
+s1.assign(B, A);
+
+/*
+1. Assign nodes to slot.
+2. Append nodes to document.
+*/
+const shadowRoot2 = host2.attachShadow({ mode: "open", slotAssignment: 'manual' });
+shadowRoot2.appendChild(slot2);
+const s2 = shadowRoot2.getElementById('slot2');
+s2.assign(D, C);
+host2.append(C, D);
+
+/*
+1. Assign nodes to slot.
+2. Change the fallback content.
+3. Append nodes to document.
+*/
+const shadowRoot3 = host3.attachShadow({ mode: "open", slotAssignment: 'manual' });
+shadowRoot3.appendChild(slot3);
+const s3 = shadowRoot3.getElementById('slot3');
+s3.assign(F, E);
+s3.innerText = 'FAIL';
+host3.append(E, F);
+
+/*
+1. Append nodes to document.
+2. Assign nodes to slot.
+3. Remove nodes from document.
+*/
+const shadowRoot4 = host4.attachShadow({ mode: "open", slotAssignment: 'manual' });
+shadowRoot4.appendChild(slot4);
+const s4 = shadowRoot4.getElementById('slot4');
+host4.append(G, H);
+s4.assign(H, G);
+G.remove();
+H.remove();
+
+/*
+1. Append nodes to document.
+2. Assign nodes to slot.
+3. Change the fallback content.
+4. Remove nodes from document.
+*/
+const shadowRoot5 = host5.attachShadow({ mode: "open", slotAssignment: 'manual' });
+shadowRoot5.appendChild(slot5);
+const s5 = shadowRoot5.getElementById('slot5');
+host5.append(I, J);
+s5.assign(J, I);
+s5.innerText = 'SLOT5';
+I.remove();
+J.remove();
+
+</script>