| <!DOCTYPE HTML> |
| <html> |
| <head> |
| <script> |
| var eventCount = 0; |
| |
| function handleClick(evt) { |
| eventCount++; |
| document.getElementById('click').textContent = 'PASS'; |
| } |
| |
| function handleTouchStart(evt) { |
| eventCount++; |
| document.getElementById('touchstart').textContent = 'PASS'; |
| } |
| |
| function handleTouchMove(evt) { |
| eventCount++; |
| document.getElementById('touchmove').textContent = 'PASS'; |
| } |
| |
| function handleTouchEnd(evt) { |
| eventCount++; |
| document.getElementById('touchend').textContent = 'PASS'; |
| } |
| |
| function handleTouchCancel(evt) { |
| eventCount++; |
| document.getElementById('touchcancel').textContent = 'PASS'; |
| } |
| |
| function fireEvents() { |
| if (!window.testRunner || !window.eventSender) { |
| document.write('This test does not work in manual mode.'); |
| } else { |
| var svg = document.getElementById('svg'); |
| var positionX = svg.offsetLeft + 30; |
| var positionY = svg.offsetTop + 30; |
| |
| // Touch, move, end. |
| eventSender.addTouchPoint(positionX, positionY); |
| eventSender.touchStart(); |
| eventSender.updateTouchPoint(0, positionX + 10, positionY + 10); |
| eventSender.touchMove(); |
| eventSender.releaseTouchPoint(0); |
| eventSender.touchEnd(); |
| // Touch, cancel. |
| eventSender.addTouchPoint(positionX, positionY); |
| eventSender.touchStart(); |
| eventSender.updateTouchPoint(0, positionX + 10, positionY + 10); |
| eventSender.cancelTouchPoint(0); |
| eventSender.touchCancel(); |
| // Click. |
| eventSender.mouseMoveTo(positionX, positionY); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| |
| // Fire some events that do not hit the rect. |
| eventSender.addTouchPoint(positionX - 30, positionY - 30); |
| eventSender.touchStart(); |
| eventSender.updateTouchPoint(0, positionX + 5, positionY + 5); |
| eventSender.touchMove(); |
| eventSender.releaseTouchPoint(0); |
| eventSender.touchEnd(); |
| |
| document.getElementById('eventcount').textContent = |
| eventCount == 6 ? 'PASS' : 'FAIL: expected 6 events, got ' + eventCount; |
| |
| testRunner.dumpAsText(); |
| } |
| } |
| </script> |
| </head> |
| <body onload="fireEvents()"> |
| This test passes if you see a series of PASS lines below:<br/> |
| onclick fired: <span id="click">FAIL</span><br/> |
| ontouchstart fired: <span id="touchstart">FAIL</span><br/> |
| ontouchmove fired: <span id="touchmove">FAIL</span><br/> |
| ontouchend fired: <span id="touchend">FAIL</span><br/> |
| ontouchcancel fired: <span id="touchcancel">FAIL</span><br/> |
| total event count is 6: <span id="eventcount">FAIL</span><br/> |
| <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100" height="100" id="svg"> |
| <rect id="rect" x="20" y="20" width="60" height="60" fill="green" onclick="handleClick()" ontouchstart="handleTouchStart()" ontouchmove="handleTouchMove()" ontouchend="handleTouchEnd()" ontouchcancel="handleTouchCancel()"/> |
| </svg> |
| </body> |
| </html> |