| <!DOCTYPE html> |
| <html><body> |
| <script src="../../../resources/js-test-pre.js"></script> |
| |
| <p>Touch event should be fired in Shadow DOM.</p> |
| <p>Elements in ShadowDOM should not be revealed in touchTarget if it's examined in non shadow tree.</p> |
| |
| <div id="container"> |
| <input id="input1" type="text"> |
| <div id="host1"></div> |
| </div> |
| <pre id="console"></pre> |
| |
| <script> |
| var shadowRoot1 = host1.webkitCreateShadowRoot(); |
| shadowRoot1.innerHTML = 'foo <span id="host2">bar</span> baz'; |
| |
| var host2 = shadowRoot1.getElementById('host2'); |
| var shadowRoot2 = host2.webkitCreateShadowRoot(); |
| shadowRoot2.innerHTML = '(foo <span id="target">bar</span> baz)'; |
| |
| var target = shadowRoot2.getElementById('target'); |
| |
| var touchTargetsForHost1; |
| host1.addEventListener('touchstart', function(e) { |
| touchTargetForHost1 = e.targetTouches[0].target; |
| }); |
| |
| var touchstartFiredInShadowDOM = false; |
| target.addEventListener('touchstart', function(e) { |
| touchstartFiredInShadowDOM = true; |
| }); |
| |
| var touchTargetForInput1; |
| input1.addEventListener('touchstart', function(e) { |
| touchTargetForInput1 = e.targetTouches[0].target; |
| }); |
| |
| eventSender.clearTouchPoints(); |
| eventSender.addTouchPoint(target.offsetLeft + target.offsetWidth / 2, target.offsetTop + target.offsetHeight / 2); |
| eventSender.addTouchPoint(input1.offsetLeft + input1.offsetWidth / 2, input1.offsetTop + input1.offsetHeight / 2); |
| eventSender.touchStart(); |
| eventSender.touchEnd(); |
| |
| shouldBeTrue('touchstartFiredInShadowDOM'); |
| shouldBe('touchTargetForHost1', 'host1'); |
| shouldBe('touchTargetForInput1', 'input1'); |
| |
| container.remove(); |
| </script> |
| |
| <script src="../../../resources/js-test-post.js"></script> |
| </body></html> |
