<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="compositor-touch-hit-rects.css">
<style>
html {
  font-size: 10px;
}
.testcase, .testcase * {
  border: 1px solid red;
  padding: 5px;
}

</style>
</head>
<body id='tests'>
  <br><br>
  <div id='child' class='testcase'>
    Div inside iframe
  </div>
  <br><br><br>
  <script>
  if (window.testRunner)
      document.documentElement.setAttribute('dumpRenderTree', 'true');

  function handler() {};
  frameElement.addHandlers = function() {
    document.getElementById('child').addEventListener('touchstart', handler, false);
  }
  frameElement.removeHandlers = function() {
    document.getElementById('child').removeEventListener('touchstart', handler, false);
  }
  // Scroll so the div is just slightly clipped.
  document.scrollingElement.scrollTop = 40;
  </script>
</body>
</html>