| OLD | NEW |
| (Empty) | |
| 1 <!DOCTYPE HTML> |
| 2 <script src='../../../../../resources/js-test.js'></script> |
| 3 <style> |
| 4 iframe { |
| 5 width: 300px; |
| 6 height: 300px; |
| 7 top: 100px; |
| 8 left: 50px; |
| 9 border: 0; |
| 10 position: absolute; |
| 11 background: green; |
| 12 } |
| 13 #outerFrame { |
| 14 width: 500px; |
| 15 height: 500px; |
| 16 background: blue; |
| 17 } |
| 18 </style> |
| 19 |
| 20 <body> |
| 21 <div id='outerFrame'> |
| 22 <iframe id='target' srcdoc=" |
| 23 <body id='innerFrame' style='height:500px; width: 500px; padding: 0; margin: 0
;'> |
| 24 <script> |
| 25 top.document.testEventList.forEach(function(eventName) { |
| 26 document.documentElement.addEventListener(eventName, function(event) { |
| 27 top.document.events.push(event); |
| 28 }); |
| 29 }); |
| 30 </script> |
| 31 </body>"> |
| 32 </iframe> |
| 33 </div> |
| 34 |
| 35 <div id='console'></div> |
| 36 |
| 37 <script> |
| 38 document.testEventList = ['pointerup', 'pointerdown', 'pointermove', 'gotpointer
capture', 'lostpointercapture', 'pointercancel', |
| 39 'touchstart', 'touchmove', 'touchend']; |
| 40 document.testEventList.forEach(function(eventName) { |
| 41 document.getElementById('outerFrame').addEventListener(eventName, function(eve
nt) { |
| 42 document.events.push(event); |
| 43 }); |
| 44 }); |
| 45 |
| 46 var attributes = [ |
| 47 'target' |
| 48 ]; |
| 49 |
| 50 document.events = []; |
| 51 |
| 52 function runTests() { |
| 53 // touch events inside iframe |
| 54 |
| 55 debug('*** First touch down in innerFrame and move ***'); |
| 56 eventSender.addTouchPoint(200, 200) |
| 57 eventSender.touchStart(); |
| 58 eventSender.updateTouchPoint(0, 200, 200); |
| 59 eventSender.touchMove(); |
| 60 dumpEvents(); |
| 61 debug(''); |
| 62 |
| 63 debug('*** Second touch down in outerFrame ***'); |
| 64 eventSender.addTouchPoint(20, 20) |
| 65 eventSender.touchStart(); |
| 66 dumpEvents(); |
| 67 debug(''); |
| 68 |
| 69 debug('*** Second touch move in outerFrame ***'); |
| 70 eventSender.updateTouchPoint(1, 40, 40); |
| 71 eventSender.touchMove(); |
| 72 dumpEvents(); |
| 73 debug(''); |
| 74 |
| 75 debug('*** Second touch move into innerFrame ***'); |
| 76 eventSender.updateTouchPoint(1, 100, 200); |
| 77 eventSender.touchMove(); |
| 78 dumpEvents(); |
| 79 debug(''); |
| 80 |
| 81 debug('*** First touch move in innerFrame ***'); |
| 82 eventSender.updateTouchPoint(0, 250, 250); |
| 83 eventSender.touchMove(); |
| 84 dumpEvents(); |
| 85 debug(''); |
| 86 |
| 87 debug('*** First touch move out of innerFrame ***'); |
| 88 eventSender.updateTouchPoint(0, 20, 20); |
| 89 eventSender.touchMove(); |
| 90 dumpEvents(); |
| 91 debug(''); |
| 92 |
| 93 debug('*** Releasing touches ***'); |
| 94 eventSender.releaseTouchPoint(0); |
| 95 eventSender.releaseTouchPoint(1); |
| 96 eventSender.touchEnd(); |
| 97 dumpEvents(); |
| 98 debug(''); |
| 99 |
| 100 testRunner.notifyDone(); |
| 101 } |
| 102 |
| 103 function dumpEvents() |
| 104 { |
| 105 document.events.forEach(function(event) { |
| 106 if (event.type.includes('pointer')) { |
| 107 debug(event.target.id + ' recieved ' + event.type); |
| 108 } else if (event.type.startsWith('touch')) { |
| 109 debug(event.type + ' is recieved with changedTouches.length=' + event.chan
gedTouches.length + ':'); |
| 110 for(var i=0; i<event.changedTouches.length; i++) { |
| 111 debug(' Touch with id=' + event.changedTouches[i].identifier + ' with t
arget = ' + event.changedTouches[i].target.id); |
| 112 } |
| 113 } |
| 114 }); |
| 115 document.events = []; |
| 116 } |
| 117 |
| 118 if (window.eventSender) { |
| 119 testRunner.waitUntilDone(); |
| 120 window.onload = runTests; |
| 121 } else |
| 122 debug('This test requires eventSender'); |
| 123 |
| 124 description("This test verifies clientX/Y of pointer events inside iframe."); |
| 125 |
| 126 </script> |
| 127 </body> |
| OLD | NEW |