Chromium Code Reviews Chromium Code Reviews
Issue 1606153002:
Implement v1 slot logic in EventPath (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master| Index: third_party/WebKit/LayoutTests/fast/dom/shadow/event-path-with-slot.html |
| diff --git a/third_party/WebKit/LayoutTests/fast/dom/shadow/event-path-with-slot.html b/third_party/WebKit/LayoutTests/fast/dom/shadow/event-path-with-slot.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..c0e7335e81992934e7d459bd31ebe34428a4ab6b |
| --- /dev/null |
| +++ b/third_party/WebKit/LayoutTests/fast/dom/shadow/event-path-with-slot.html |
| @@ -0,0 +1,90 @@ |
| +<!DOCTYPE html> |
| +<script src='../../../resources/testharness.js'></script> |
| +<script src='../../../resources/testharnessreport.js'></script> |
| +<script src='resources/shadow-dom.js'></script> |
| +<div id='host1'> |
| + <input id='input1' slot='slot1'> |
| + <template data-mode='open'> |
| + <slot name='slot1'></slot> |
| + </template> |
| +</div> |
| + |
| +<div id='host2'> |
| + <input id='input2' slot='slot2'> |
| + <template data-mode='open'> |
| + <div id='host3'> |
| + <div id='slot2-parent'> |
| + <slot name='slot2'></slot> |
| + </div> |
| + <template data-mode='v0'> |
| + <content select='#slot2-parent'></content> |
| + </template> |
| + </div> |
| + </template> |
| +</div> |
| + |
| +<div id='host4'> |
| + <template data-mode='open'> |
| + <slot name='slot3'></slot> |
| + </template> |
| + <div id='input-parent' slot='slot3'> |
| + <input id='input3'> |
| + </div> |
| +</div> |
| +<script> |
| + |
| +var host1 = document.getElementById('host1'); |
|
kochi
2016/01/21 01:26:33
nit: if an element with ID "host1" (in this file,
yuzuchan
2016/01/21 05:10:22
Done.
|
| +convertTemplatesToShadowRootsWithin(host1); |
| +removeWhiteSpaceOnlyTextNodes(host1); |
| +document.body.offsetLeft; |
| + |
| +var input1 = document.getElementById('input1'); |
| +var slot1 = host1.shadowRoot.querySelector('slot'); |
| +var shadowRoot = host1.shadowRoot; |
| + |
| +input1.onfocus = function(e) { |
| + var expected_array1 = [input1, slot1, shadowRoot, host1, document.body, document.documentElement, document, window]; |
| + test(function() { |
|
kochi
2016/01/21 01:26:33
If the event doesn't happen accidentally, this tes
kochi
2016/01/21 04:55:47
The "focus" event is synchronous (i.e. when such e
yuzuchan
2016/01/21 05:10:22
Thanks for pointing out the issue. How about addin
kochi
2016/01/21 05:22:58
One setup() can only check one "done();"?
So if y
yuzuchan
2016/01/21 07:18:12
Done.
|
| + assert_array_equals(e.path, expected_array1); |
| + }, 'Triggered in a slotted element, eventPath should go through shadow tree.'); |
| +}; |
| + |
| +var input2 = document.getElementById('input2'); |
| +var host2 = document.getElementById('host2'); |
| +convertTemplatesToShadowRootsWithin(host2); |
| +var shadowRootV1 = host2.shadowRoot; |
| +var host3 = shadowRootV1.querySelector('#host3'); |
| +convertTemplatesToShadowRootsWithin(host3); |
| +var slotParent = host3.querySelector('div'); |
| +var slot2 = host3.querySelector('slot'); |
| +var shadowRootV0 = host3.shadowRoot; |
| +var content = shadowRootV0.querySelector('content'); |
| + |
| +input2.onfocus = function(e) { |
| + var expected_array2 = [input2, slot2, slotParent, content, shadowRootV0, host3, shadowRootV1, host2, document.body, document.documentElement, document, window]; |
| + test(function() { |
| + assert_array_equals(e.path, expected_array2); |
| + }, 'EventPath works fine with v0 insertion points & v1 slots.'); |
| +}; |
| + |
| +var host4 = document.getElementById('host4'); |
| +convertTemplatesToShadowRootsWithin(host4); |
| +var shadowRoot2 = host4.shadowRoot; |
| +var slot3 = shadowRoot2.querySelector('slot'); |
| +var input3 = document.getElementById('input3') |
| +var inputParent = document.getElementById('input-parent'); |
| + |
| +input3.onfocus = function(e) { |
| + var expected_array3 = [input3, inputParent, slot3, shadowRoot2, host4, document.body, document.documentElement, document, window]; |
| + test(function() { |
| + assert_array_equals(e.path, expected_array3); |
| + }, 'EventPath works fine when event happens to a descendant of a slotted element.'); |
| +}; |
| + |
| +var focusEvent = document.createEvent('MouseEvents'); |
| +focusEvent.initMouseEvent('focus'); |
| +input1.dispatchEvent(focusEvent); |
| +input2.dispatchEvent(focusEvent); |
| +input3.dispatchEvent(focusEvent); |
| + |
| +</script> |
