OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <script src='../../../resources/testharness.js'></script> | 2 <script src='../../../resources/testharness.js'></script> |
3 <script src='../../../resources/testharnessreport.js'></script> | 3 <script src='../../../resources/testharnessreport.js'></script> |
4 <script src='resources/shadow-dom.js'></script> | 4 <script src='resources/shadow-dom.js'></script> |
5 <div id='host'> | 5 <div id='host'> |
6 <template data-mode='open'> | 6 <template data-mode='open'> |
7 <div id='shadow-child1'></div> | 7 <div id='shadow-child1'></div> |
8 <slot></slot> | 8 <slot></slot> |
9 <slot name='slot1'></slot> | 9 <slot name='slot1'></slot> |
10 <div id='shadow-child2'></div> | 10 <div id='shadow-child2'></div> |
11 </template> | 11 </template> |
12 <div id='child1' slot='slot1'></div> | 12 <div id='child1' slot='slot1'></div> |
13 Hello | 13 Hello |
14 <div id='child2'></div> | 14 <div id='child2'></div> |
15 World | 15 World |
16 <div id='child3' slot='nonexistent'></div> | 16 <div id='child3' slot='nonexistent'></div> |
| 17 <!-- comment node --> |
17 </div> | 18 </div> |
18 <script> | 19 <script> |
19 'use strict'; | 20 'use strict'; |
20 convertTemplatesToShadowRootsWithin(host); | 21 convertTemplatesToShadowRootsWithin(host); |
21 removeWhiteSpaceOnlyTextNodes(host); | 22 removeWhiteSpaceOnlyTextNodes(host); |
22 document.body.offsetLeft; | 23 document.body.offsetLeft; |
23 | 24 |
24 const slot1 = host.shadowRoot.querySelector('slot[name=slot1]'); | 25 const slot1 = host.shadowRoot.querySelector('slot[name=slot1]'); |
25 const defaultSlot = host.shadowRoot.querySelector('slot'); | 26 const defaultSlot = host.shadowRoot.querySelector('slot'); |
26 const shadowChild1 = host.shadowRoot.querySelector('#shadow-child1'); | 27 const shadowChild1 = host.shadowRoot.querySelector('#shadow-child1'); |
27 const shadowChild2 = host.shadowRoot.querySelector('#shadow-child2'); | 28 const shadowChild2 = host.shadowRoot.querySelector('#shadow-child2'); |
28 | 29 |
29 const textHello = host.childNodes[1]; | 30 const textHello = host.childNodes[1]; |
30 const textWorld = host.childNodes[3]; | 31 const textWorld = host.childNodes[3]; |
| 32 const commentNode = child3.nextSibling; |
31 | 33 |
32 test(() => { | 34 test(() => { |
33 assert_equals(textHello.nodeValue.trim(), 'Hello'); | 35 assert_equals(textHello.nodeValue.trim(), 'Hello'); |
34 assert_equals(textWorld.nodeValue.trim(), 'World'); | 36 assert_equals(textWorld.nodeValue.trim(), 'World'); |
| 37 assert_equals(commentNode.nodeType, Node.COMMENT_NODE); |
| 38 |
35 assert_equals(textHello.assignedSlot, defaultSlot); | 39 assert_equals(textHello.assignedSlot, defaultSlot); |
36 assert_equals(textWorld.assignedSlot, defaultSlot); | 40 assert_equals(textWorld.assignedSlot, defaultSlot); |
| 41 assert_equals(commentNode.assignedSlot, undefined, "Comment Node does not defi
ne assignedSlot"); |
37 assert_equals(child1.assignedSlot, slot1); | 42 assert_equals(child1.assignedSlot, slot1); |
38 assert_equals(child2.assignedSlot, defaultSlot); | 43 assert_equals(child2.assignedSlot, defaultSlot); |
39 assert_equals(child3.assignedSlot, null); | 44 assert_equals(child3.assignedSlot, null); |
40 }, "assignedSlot"); | 45 }, "assignedSlot"); |
41 | 46 |
42 test(() => { | 47 test(() => { |
43 assert_array_equals(defaultSlot.getAssignedNodes({flatten: true}), [textHello,
child2, textWorld]); | 48 assert_array_equals(defaultSlot.getAssignedNodes({flatten: true}), [textHello,
child2, textWorld]); |
44 assert_array_equals(slot1.getAssignedNodes({flatten: true}), [child1]); | 49 assert_array_equals(slot1.getAssignedNodes({flatten: true}), [child1]); |
45 }, "getDistributedNodes"); | 50 }, "getAssignedNodes"); |
46 | 51 |
47 add_completion_callback(() => { | 52 add_completion_callback(() => { |
48 if (window.testRunner) | 53 if (window.testRunner) |
49 host.style.display = "none"; | 54 host.style.display = "none"; |
50 }); | 55 }); |
51 </script> | 56 </script> |
OLD | NEW |