Chromium Code Reviews| Index: third_party/WebKit/LayoutTests/shadow-dom/event-composed-path-with-related-target.html |
| diff --git a/third_party/WebKit/LayoutTests/shadow-dom/event-composed-path-with-related-target.html b/third_party/WebKit/LayoutTests/shadow-dom/event-composed-path-with-related-target.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..9f6e3a38b1aaad3ff69aff41d51c196933c92696 |
| --- /dev/null |
| +++ b/third_party/WebKit/LayoutTests/shadow-dom/event-composed-path-with-related-target.html |
| @@ -0,0 +1,254 @@ |
| +<!DOCTYPE html> |
| +<script src="../resources/testharness.js"></script> |
| +<script src="../resources/testharnessreport.js"></script> |
| +<script src="resources/shadow-dom.js"></script> |
| + |
| +<div id="test1"> |
| + <div id="target"></div> |
| + <div id="related"></div> |
| +</div> |
| + |
| +<script> |
| +test(() => { |
| + let n = createTestTree(test1); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.related })); |
| + let path = ['target', 'test1']; |
| + assert_event_path_equals(log, [['target', 'target', 'related', path], |
| + ['test1', 'target', 'related', path]]); |
| +}, 'Event Path test1-1'); |
|
tkent
2016/06/15 13:16:28
Please make it more descriptive like test1-2.
hayato
2016/06/16 07:46:23
Done. I have made every tests more descriptive.
|
| +</script> |
| + |
| +<script> |
| +test(() => { |
| + let n = createTestTree(test1); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.target })); |
| + let path = ['target', 'test1']; |
| + assert_event_path_equals(log, [['target', 'target', 'target', path], |
| + ['test1', 'target', 'target', path]]); |
| +}, 'Event Path test1-2: Event should be dispatched if 1) target and relatedTarget are same, and 2) they are not in a shadow tree'); |
| +</script> |
| + |
| +<div id="test2"> |
| + <div id="host"> |
| + <template id="sr" data-mode="open"> |
| + <div id="target"></div> |
| + <div id="related"></div> |
| + </template> |
| + </div> |
| +</div> |
| + |
| +<script> |
| +test(() => { |
| + let n = createTestTree(test2); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.related })); |
| + let path = ['target', 'sr']; |
| + assert_event_path_equals(log, [['target', 'target', 'related', path], |
| + ['sr', 'target', 'related', path]]); |
| +}, 'Event Path test2-1: Event should stop at the shadow root'); |
| + |
| +test(() => { |
| + let n = createTestTree(test2); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.target })); |
| + assert_event_path_equals(log, []); |
| +}, 'Event Path test2-2: Event should not be dispatched if 1) target and relatedTarget are same, and 2) both are in a shadow tree'); |
| +</script> |
| + |
| +<div id="test3_1"> |
| + <div id="host1"> |
| + <template id="sr1" data-mode="open"> |
| + <div id="target1"></div> |
| + </template> |
| + </div> |
| +</div> |
| + |
| +<div id="test3_2"> |
| + <div id="host2"> |
| + <template id="sr2" data-mode="open"> |
| + <div id="target2"></div> |
| + </template> |
| + </div> |
| +</div> |
| + |
| +<script> |
| +test(() => { |
| + let n1 = createTestTree(test3_1); |
| + let n2 = createTestTree(test3_2); |
| + let log = dispatchEventWithLog(n1, n1.target1, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n2.target2 })); |
| + let path = ['target1', 'sr1', 'host1', 'test3_1']; |
| + assert_event_path_equals(log, [['target1', 'target1', 'host2', path], |
| + ['sr1', 'target1', 'host2', path], |
| + ['host1', 'host1', 'host2', path], |
| + ['test3_1', 'host1', 'host2', path]]); |
| +}, 'Event Path test_d-1: Event with two disconnected trees.'); |
| + |
| +test(() => { |
| + let n1 = createTestTree(test3_1); |
| + let n2 = createTestTree(test3_2); |
| + let log = dispatchEventWithLog(n1, n1.host1, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n2.target2 })); |
| + let path = ['host1', 'test3_1']; |
| + assert_event_path_equals(log, [['host1', 'host1', 'host2', path], |
| + ['test3_1', 'host1', 'host2', path]]); |
| +}, 'Event Path test_d-2: Event with two disconnected trees.'); |
| +</script> |
| + |
| +<div id="test4"> |
| + <div id="host1"> |
| + <template id="sr1" data-mode="open"> |
| + <div id="host2"> |
| + <template id="sr2" data-mode="open"> |
| + <div id="target"></div> |
| + </template> |
| + </div> |
| + <div id="host3"> |
| + <template id="sr3" data-mode="open"> |
| + <div id="related"></div> |
| + </template> |
| + </div> |
| + </template> |
| + </div> |
| +</div> |
| + |
| +<script> |
| +test(() => { |
| + let n = createTestTree(test4); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.related })); |
| + let path = ['target', 'sr2', 'host2', 'sr1']; |
| + assert_event_path_equals(log, [['target', 'target', 'host3', path], |
| + ['sr2', 'target', 'host3', path], |
| + ['host2', 'host2', 'host3', path], |
| + ['sr1', 'host2', 'host3', path]]); |
| +}, 'Event Path test3-1'); |
|
tkent
2016/06/15 13:16:29
Ditto.
|
| + |
| +test(() => { |
| + let n = createTestTree(test4); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.host1 })); |
| + let path = ['target', 'sr2', 'host2', 'sr1']; |
| + assert_event_path_equals(log, [['target', 'target', 'host1', path], |
| + ['sr2', 'target', 'host1', path], |
| + ['host2', 'host2', 'host1', path], |
| + ['sr1', 'host2', 'host1', path]]); |
| +}, 'Event Path test3-2'); |
|
tkent
2016/06/15 13:16:29
Ditto.
|
| + |
| +test(() => { |
| + let n = createTestTree(test4); |
| + let log = dispatchEventWithLog(n, n.host1, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.target })); |
| + assert_event_path_equals(log, []); |
| +}, 'Event Path test3-3'); |
|
tkent
2016/06/15 13:16:28
Ditto.
|
| +</script> |
| + |
| +<div id="test5"> |
| + <div id="host"> |
| + <template id="sr" data-mode="open"> |
| + <slot id="slot"></slot> |
| + <div id="related"></div> |
| + </template> |
| + <div id="target"></div> |
| + </div> |
| +</div> |
| + |
| +<script> |
| +test(() => { |
| + let n = createTestTree(test5); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.related })); |
| + let path = ['target', 'slot', 'sr', 'host', 'test5']; |
| + assert_event_path_equals(log, [['target', 'target', 'host', path], |
| + ['slot', 'target', 'related', path], |
| + ['sr', 'target', 'related', path], |
| + ['host', 'target', 'host', path], |
| + ['test5', 'target', 'host', path]]); |
| +}, 'Event Path test4-1'); |
|
tkent
2016/06/15 13:16:29
Ditto.
|
| + |
| +test(() => { |
| + let n = createTestTree(test5); |
| + let log = dispatchEventWithLog(n, n.related, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.target })); |
| + let path = ['related', 'sr', 'host', 'test5']; |
| + assert_event_path_equals(log, [['related', 'related', 'target', path], |
| + ['sr', 'related', 'target', path], |
| + ['host', 'host', 'target', path], |
| + ['test5', 'host', 'target', path]]); |
| +}, 'Event Path test4-2'); |
|
tkent
2016/06/15 13:16:29
Ditto.
|
| +</script> |
| + |
| +<div id="test6"> |
| + <div id="host0"> |
| + <template id="sr0" data-mode="open"> |
| + <div id="host1"> |
| + <template id="sr1" data-mode="open"> |
| + <div id="host2"> |
| + <template id="sr2" data-mode="open"> |
| + <slot id="slot2"></slot> |
| + <div id="related2"></div> |
| + </template> |
| + <div id="related1"></div> |
| + <div id="d1"> |
| + <slot id="slot1"></slot> |
| + </div> |
| + </div> |
| + </template> |
| + <div id="host3"> |
| + <template id="sr3" data-mode="open"> |
| + <div id="host4"> |
| + <template id="sr4" data-mode="open"> |
| + <div id="host5"> |
| + <template id="sr5" data-mode="open"> |
| + <slot id="slot5"></slot> |
| + </template> |
| + <slot id="slot4"></slot> |
| + </div> |
| + </template> |
| + <div id="target"></div> |
| + </div> |
| + </template> |
| + </div> |
| + </div> |
| + </template> |
| + </div> |
| +</div> |
| + |
| +<script> |
| +test(() => { |
| + let n = createTestTree(test6); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.related1 })); |
| + let path = ['target', 'slot4', 'slot5', 'sr5', 'host5', 'sr4', 'host4', 'sr3', 'host3', 'slot1', 'd1', 'slot2', 'sr2', 'host2', 'sr1', 'host1', 'sr0']; |
| + assert_event_path_equals(log, [['target', 'target', 'host1', path], |
| + ['slot4', 'target', 'host1', path], |
| + ['slot5', 'target', 'host1', path], |
| + ['sr5', 'target', 'host1', path], |
| + ['host5', 'target', 'host1', path], |
| + ['sr4', 'target', 'host1', path], |
| + ['host4', 'target', 'host1', path], |
| + ['sr3', 'target', 'host1', path], |
| + ['host3', 'host3', 'host1', path], |
| + ['slot1', 'host3', 'related1', path], |
| + ['d1' , 'host3', 'related1', path], |
| + ['slot2', 'host3', 'related1', path], |
| + ['sr2', 'host3', 'related1', path], |
| + ['host2', 'host3', 'related1', path], |
| + ['sr1', 'host3', 'related1', path], |
| + ['host1', 'host3', 'host1', path], |
| + ['sr0', 'host3', 'host1' , path]]); |
| +}, 'Event Path test5-1'); |
|
tkent
2016/06/15 13:16:29
Ditto.
|
| + |
| +test(() => { |
| + let n = createTestTree(test6); |
| + let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbles: true, composed: true, relatedTarget: n.related2 })); |
| + let path = ['target', 'slot4', 'slot5', 'sr5', 'host5', 'sr4', 'host4', 'sr3', 'host3', 'slot1', 'd1', 'slot2', 'sr2', 'host2', 'sr1', 'host1', 'sr0']; |
| + assert_event_path_equals(log, [['target', 'target', 'host1', path], |
| + ['slot4', 'target', 'host1', path], |
| + ['slot5', 'target', 'host1', path], |
| + ['sr5', 'target', 'host1', path], |
| + ['host5', 'target', 'host1', path], |
| + ['sr4', 'target', 'host1', path], |
| + ['host4', 'target', 'host1', path], |
| + ['sr3', 'target', 'host1', path], |
| + ['host3', 'host3', 'host1', path], |
| + ['slot1', 'host3', 'host2', path], |
| + ['d1' , 'host3', 'host2', path], |
| + ['slot2', 'host3', 'related2', path], |
| + ['sr2', 'host3', 'related2', path], |
| + ['host2', 'host3', 'host2', path], |
| + ['sr1', 'host3', 'host2', path], |
| + ['host1', 'host3', 'host1', path], |
| + ['sr0', 'host3', 'host1' , path]]); |
| +}, 'Event Path test5-2'); |
|
tkent
2016/06/15 13:16:29
Ditto.
|
| +</script> |