third_party/WebKit/LayoutTests/touchadjustment/simple-shadow-dom.html

   1 <!DOCTYPE html>
   2 <head>
   3 <style>
   4 #targetDiv {
   5     background: #00f;
   6     height: 100px;
   7     width: 100px;
   8     position: absolute;
   9     left: 0px;
  10     top: 0px;
  11 }
  12 </style>
  13 </head>
  14 <div id="targetDiv"></div>
  15
  16 <script src="../resources/js-test.js"></script>
  17 <script src="resources/touchadjustment.js"></script>
  18 <script>
  19 function addShadowDOM() {
  20     var targetDiv = document.getElementById("targetDiv");
  21     var root = targetDiv.createShadowRoot();
  22     var shadowDiv = document.createElement("div");
  23     shadowDiv.style.width = "50px";
  24     shadowDiv.style.height = "50px";
  25     shadowDiv.style.background = "#ff0";
  26     shadowDiv.style.position = "absolute";
  27     shadowDiv.style.left = "0px";
  28     shadowDiv.style.top = "0px";
  29     shadowDiv.id = 'shadowDiv';
  30     shadowDiv.addEventListener('click', function() {}, false);
  31     root.appendChild(shadowDiv);
  32     return shadowDiv;
  33 }
  34
  35 function runTouchTests() {
  36     var shadowDiv = addShadowDOM();
  37     element = document.getElementById("targetDiv");
  38     element.addEventListener('click', function() {}, false);
  39     document.addEventListener('click', function() {}, false);
  40     testTouchPoint(touchPoint(25, 25, 10), shadowDiv);
  41 }
  42
  43 function runTests()
  44 {
  45     if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
  46         description('Test that a hit right in the middle of a shadow dom node returns it and not its host.')
  47         runTouchTests();
  48     }
  49 }
  50 runTests();
  51 </script>