page_with_touch_handler.html | Explore in Territory

<!DOCTYPE html>
<html style="width: 100%; height: 100%">
<head>
  <script>
    function touchHandler(e, type) {
      var touchResult = document.getElementById("last-touch-event");
      touchResult.innerHTML = type;
    }

    function getLastTouchEvent() {
      var touchResult = document.getElementById("last-touch-event");
      return touchResult.innerHTML;
    }

    window.addEventListener('load', function(){ // on page load
      document.body.addEventListener('touchstart',
                                      function(e){
                                        touchHandler(e, "touchstart");
                                      }, false);

      document.body.addEventListener('touchmove',
                                      function(e){
                                        touchHandler(e, "touchmove");
                                      }, false);

      document.body.addEventListener('touchend',
                                      function(e){
                                        touchHandler(e, "touchend");
                                      }, false);
    }, false);
  </script>
</head>

<!-- Be sure to set 100% width/height so the test can determine an appropriate
     screen region for targeting events. -->
<!-- Make the body touch-action: none to force sending the touch action back
     to the browser during the test, so we can verify that functionality. -->
<body style="width: 100%; height: 100%; touch-action: none">
  Page with Touch Handler
  <div id="last-touch-event">noevent</div>
</body>
</html>
chromium/content/test/data/page_with_touch_handler.html
