| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src='../../../resources/testharness.js'></script> |
| 3 <script src='../../../resources/testharnessreport.js'></script> |
| 4 <script src='resources/shadow-dom.js'></script> |
| 5 <div id='host1'> |
| 6 <input id='input1' slot='slot1'> |
| 7 <template data-mode='open'> |
| 8 <slot name='slot1'></slot> |
| 9 </template> |
| 10 </div> |
| 11 |
| 12 <div id='host2'> |
| 13 <input id='input2' slot='slot2'> |
| 14 <template data-mode='open'> |
| 15 <div id='host3'> |
| 16 <div id='slot2-parent'> |
| 17 <slot name='slot2'></slot> |
| 18 </div> |
| 19 <template data-mode='v0'> |
| 20 <content select='#slot2-parent'></content> |
| 21 </template> |
| 22 </div> |
| 23 </template> |
| 24 </div> |
| 25 |
| 26 <div id='host4'> |
| 27 <template data-mode='open'> |
| 28 <slot name='slot3'></slot> |
| 29 </template> |
| 30 <div id='input-parent' slot='slot3'> |
| 31 <input id='input3'> |
| 32 </div> |
| 33 </div> |
| 34 <script> |
| 35 |
| 36 test(function() { |
| 37 var host1 = document.getElementById('host1'); |
| 38 convertTemplatesToShadowRootsWithin(host1); |
| 39 removeWhiteSpaceOnlyTextNodes(host1); |
| 40 document.body.offsetLeft; |
| 41 var input1 = document.getElementById('input1'); |
| 42 var slot1 = host1.shadowRoot.querySelector('slot'); |
| 43 var shadowRoot = host1.shadowRoot; |
| 44 input1.onfocus = function(e) { |
| 45 var expected_array1 = [input1, slot1, shadowRoot, host1, document.body, docu
ment.documentElement, document, window]; |
| 46 assert_array_equals(e.path, expected_array1); |
| 47 }; |
| 48 input1.focus(); |
| 49 }, 'Triggered in a slotted element, eventPath should go through shadow tree.'); |
| 50 |
| 51 test(function() { |
| 52 var input2 = document.getElementById('input2'); |
| 53 var host2 = document.getElementById('host2'); |
| 54 convertTemplatesToShadowRootsWithin(host2); |
| 55 var shadowRootV1 = host2.shadowRoot; |
| 56 var host3 = shadowRootV1.querySelector('#host3'); |
| 57 convertTemplatesToShadowRootsWithin(host3); |
| 58 var slotParent = host3.querySelector('div'); |
| 59 var slot2 = host3.querySelector('slot'); |
| 60 var shadowRootV0 = host3.shadowRoot; |
| 61 var content = shadowRootV0.querySelector('content'); |
| 62 |
| 63 input2.onfocus = function(e) { |
| 64 var expected_array2 = [input2, slot2, slotParent, content, shadowRootV0, hos
t3, shadowRootV1, host2, document.body, document.documentElement, document, wind
ow]; |
| 65 assert_array_equals(e.path, expected_array2); |
| 66 }; |
| 67 input2.focus(); |
| 68 }, 'EventPath works fine with v0 insertion points & v1 slots.'); |
| 69 |
| 70 test(function() { |
| 71 var host4 = document.getElementById('host4'); |
| 72 convertTemplatesToShadowRootsWithin(host4); |
| 73 var shadowRoot2 = host4.shadowRoot; |
| 74 var slot3 = shadowRoot2.querySelector('slot'); |
| 75 var input3 = document.getElementById('input3') |
| 76 var inputParent = document.getElementById('input-parent'); |
| 77 input3.onfocus = function(e) { |
| 78 var expected_array3 = [input3, inputParent, slot3, shadowRoot2, host4, docum
ent.body, document.documentElement, document, window]; |
| 79 assert_array_equals(e.path, expected_array3); |
| 80 }; |
| 81 input3.focus(); |
| 82 }, 'EventPath works fine when event happens to a descendant of a slotted element
.'); |
| 83 |
| 84 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1606153002:
Implement v1 slot logic in EventPath (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master