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 <slot name='slot1'> | 7 <slot name='slot1'> |
8 <div id='fallback1'></div> | 8 <div id='fallback1'></div> |
9 </slot> | 9 </slot> |
10 <slot name='slot2'> | 10 <slot name='slot2'> |
11 <div id='fallback2'></div> | 11 <div id='fallback2'></div> |
12 </slot> | 12 </slot> |
13 </template> | 13 </template> |
14 <div id='child1' slot='slot1'></div> | 14 <div id='child1' slot='slot1'></div> |
15 </div> | 15 </div> |
16 <script> | 16 <script> |
17 'use strict'; | 17 'use strict'; |
18 convertTemplatesToShadowRootsWithin(host); | 18 convertTemplatesToShadowRootsWithin(host); |
19 removeWhiteSpaceOnlyTextNodes(host); | 19 removeWhiteSpaceOnlyTextNodes(host); |
20 document.body.offsetLeft; | 20 document.body.offsetLeft; |
21 | 21 |
22 const slot1 = host.shadowRoot.querySelector('[name=slot1]'); | 22 const slot1 = host.shadowRoot.querySelector('[name=slot1]'); |
23 const slot2 = host.shadowRoot.querySelector('[name=slot2]'); | 23 const slot2 = host.shadowRoot.querySelector('[name=slot2]'); |
24 const fallback1 = host.shadowRoot.querySelector('#fallback1'); | 24 const fallback1 = host.shadowRoot.querySelector('#fallback1'); |
25 const fallback2 = host.shadowRoot.querySelector('#fallback2'); | 25 const fallback2 = host.shadowRoot.querySelector('#fallback2'); |
26 | 26 |
27 test(() => { | 27 test(() => { |
28 assert_array_equals(slot1.getDistributedNodes(), [child1]); | 28 assert_array_equals(slot1.getAssignedNodes({flatten: true}), [child1]); |
29 assert_array_equals(slot2.getDistributedNodes(), [fallback2]); | 29 assert_array_equals(slot2.getAssignedNodes({flatten: true}), [fallback2]); |
30 }, "Slot's distributed nodes"); | 30 }, "Slot's distributed nodes"); |
31 | 31 |
32 test(() => { | 32 test(() => { |
33 // Insert | 33 // Insert |
34 const slot0 = document.createElement('slot'); | 34 const slot0 = document.createElement('slot'); |
35 slot0.setAttribute('name', 'slot1'); | 35 slot0.setAttribute('name', 'slot1'); |
36 host.shadowRoot.insertBefore(slot0, slot1); | 36 host.shadowRoot.insertBefore(slot0, slot1); |
37 | 37 |
38 assert_array_equals(slot0.getDistributedNodes(), [child1]); | 38 assert_array_equals(slot0.getAssignedNodes({flatten: true}), [child1]); |
39 assert_array_equals(slot1.getDistributedNodes(), [fallback1]); | 39 assert_array_equals(slot1.getAssignedNodes({flatten: true}), [fallback1]); |
40 assert_array_equals(slot2.getDistributedNodes(), [fallback2]); | 40 assert_array_equals(slot2.getAssignedNodes({flatten: true}), [fallback2]); |
41 | 41 |
42 // Remove | 42 // Remove |
43 host.shadowRoot.removeChild(slot0); | 43 host.shadowRoot.removeChild(slot0); |
44 assert_array_equals(slot1.getDistributedNodes(), [child1]); | 44 assert_array_equals(slot1.getAssignedNodes({flatten: true}), [child1]); |
45 assert_array_equals(slot2.getDistributedNodes(), [fallback2]); | 45 assert_array_equals(slot2.getAssignedNodes({flatten: true}), [fallback2]); |
46 }, "Slot's distributed nodes after inserting/removeing a slot."); | 46 }, "Slot's distributed nodes after inserting/removeing a slot."); |
47 | 47 |
48 test(() => { | 48 test(() => { |
49 // Attribute change | 49 // Attribute change |
50 slot1.setAttribute('name', 'slot-foo'); | 50 slot1.setAttribute('name', 'slot-foo'); |
51 assert_array_equals(slot1.getDistributedNodes(), [fallback1]); | 51 assert_array_equals(slot1.getAssignedNodes({flatten: true}), [fallback1]); |
52 assert_array_equals(slot2.getDistributedNodes(), [fallback2]); | 52 assert_array_equals(slot2.getAssignedNodes({flatten: true}), [fallback2]); |
53 | 53 |
54 child1.setAttribute('slot', 'slot-foo'); | 54 child1.setAttribute('slot', 'slot-foo'); |
55 assert_array_equals(slot1.getDistributedNodes(), [child1]); | 55 assert_array_equals(slot1.getAssignedNodes({flatten: true}), [child1]); |
56 assert_array_equals(slot2.getDistributedNodes(), [fallback2]); | 56 assert_array_equals(slot2.getAssignedNodes({flatten: true}), [fallback2]); |
57 }, "Slot's distributed nodes after the attribute is changed."); | 57 }, "Slot's distributed nodes after the attribute is changed."); |
58 </script> | 58 </script> |
OLD | NEW |