| <!DOCTYPE html> |
| |
| <html> |
| <head> |
| <meta name="viewport" content="initial-scale=1.0"> |
| <style> |
| .box { |
| position: absolute; |
| height: 100px; |
| width: 120px; |
| border: 1px solid black; |
| padding: 10px; |
| } |
| |
| input { |
| display: block; |
| margin: 50px; |
| width: 400px; |
| } |
| |
| .overflow div { |
| height: 500px; |
| } |
| </style> |
| <script> |
| if (window.testRunner) { |
| testRunner.dumpAsText(); |
| } |
| |
| function rectsAsString(rects) |
| { |
| var result = ""; |
| for (var i = 0; i < rects.length; ++i) { |
| var rect = rects[i]; |
| if (i) |
| result += '\n'; |
| result += rect.left + ', ' + rect.top + ' - ' + rect.right + ', ' + rect.bottom; |
| } |
| return result; |
| } |
| |
| function doTest() |
| { |
| document.getElementById('passive').addEventListener('touchstart', function(e) { }, { 'passive': true }) |
| |
| if (!window.internals) |
| return; |
| |
| var resultString = 'touchstart\n'; |
| var rectList = internals.touchEventRectsForEvent('touchstart'); |
| resultString += rectsAsString(rectList); |
| |
| rectList = internals.touchEventRectsForEvent('touchmove'); |
| resultString += '\ntouchstart\n' + rectsAsString(rectList); |
| |
| rectList = internals.touchEventRectsForEvent('touchend'); |
| resultString += '\ntouchend\n' + rectsAsString(rectList); |
| |
| rectList = internals.touchEventRectsForEvent('touchforcechange'); |
| resultString += '\ntouchforcechange\n' + rectsAsString(rectList); |
| |
| rectList = internals.passiveTouchEventListenerRects(); |
| resultString += '\npassive\n' + rectsAsString(rectList); |
| |
| document.getElementById('results').textContent = resultString; |
| } |
| |
| window.addEventListener('load', doTest, false); |
| </script> |
| </head> |
| <body> |
| |
| <input type="range"> |
| |
| <div class="box" style="left: 50px; top: 100px;" ontouchstart="(void)0"> |
| touch start |
| </div> |
| |
| <div class="box" style="left: 250px; top: 100px;" ontouchmove="(void)0"> |
| touch move |
| </div> |
| |
| <div class="box" style="left: 50px; top: 250px;" ontouchend="(void)0"> |
| touch end |
| </div> |
| |
| <div class="box" style="left: 250px; top: 250px;" ontouchforcechange="(void)0"> |
| touch force change |
| </div> |
| |
| <div id="passive" class="box" style="left: 50px; top: 400px;"> |
| passive |
| </div> |
| |
| <div id="passive" class="overflow box" style="left: 250px; top: 400px; overflow: scroll"> |
| <div> |
| Overflowing |
| </div> |
| </div> |
| |
| <pre id="results"></pre> |
| |
| </body> |
| </html> |