window_bug1447993.html (7617B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Test for Bug 1447993</title> 5 <style> 6 #area { 7 background: green; 8 border: 1px solid black; 9 width: 40px; 10 height: 40px; 11 } 12 13 #target { 14 background: blue; 15 border: 1px solid black; 16 width: 20px; 17 height: 20px; 18 margin: 10px; 19 } 20 </style> 21 <script src="/tests/SimpleTest/EventUtils.js"></script> 22 <script> 23 24 var tests = [ 25 topLevelDocumentEventHandling, 26 topLevelDocumentEventHandlingWithTouch, 27 iframeEventHandling, 28 ]; 29 30 function next() { 31 if (!tests.length) { 32 opener.done(); 33 window.close(); 34 } else { 35 var test = tests.shift(); 36 requestAnimationFrame(function() { setTimeout(test); }); 37 } 38 } 39 40 function start() { 41 next(); 42 } 43 44 function topLevelDocumentEventHandling() { 45 var pid; 46 var area = document.getElementById("area"); 47 var target = document.getElementById("target"); 48 var body = document.body; 49 var html = document.documentElement; 50 var eventLog = []; 51 function captureEvent(e) { 52 eventLog.push([e.type, e.composedPath()]); 53 } 54 const pathToTarget = [ target, area, body, html, document, window ]; 55 const pathToArea = [ area, body, html, document, window ]; 56 var expectedEvents = [ 57 ["pointerdown", pathToTarget], 58 ["mousedown", pathToTarget], 59 ["pointerup", pathToArea], 60 ["mouseup", pathToArea], 61 ["click", pathToTarget], 62 ]; 63 64 window.addEventListener("pointerdown", 65 function(e) { 66 captureEvent(e); 67 pid = e.pointerId; 68 area.setPointerCapture(pid); 69 }, { once: true}); 70 window.addEventListener("mousedown", 71 function(e) { 72 captureEvent(e); 73 }, { once: true}); 74 window.addEventListener("pointerup", 75 function(e) { 76 captureEvent(e); 77 area.releasePointerCapture(pid); 78 }, { once: true}); 79 window.addEventListener("mouseup", function(e) { 80 captureEvent(e); 81 }, { once: true}); 82 window.addEventListener("click", function(e) { 83 captureEvent(e); 84 }, { once: true}); 85 86 synthesizeMouseAtCenter(target, {}, window); 87 88 opener.is(eventLog.length, expectedEvents.length, 89 "[topLevelDocumentEventHandling] Same number events expected."); 90 for (var i = 0; i < eventLog.length; ++i) { 91 opener.is(eventLog[i][0], expectedEvents[i][0], 92 `topLevelDocumentEventHandling ${i}`); 93 for (var j = 0; j < eventLog[i][1].length; ++j) { 94 opener.is(eventLog[i][1][j], expectedEvents[i][1][j], 95 `topLevelDocumentEventHandling ${i} ${j}`); 96 } 97 } 98 next(); 99 } 100 101 function topLevelDocumentEventHandlingWithTouch() { 102 var pid; 103 var area = document.getElementById("area"); 104 var target = document.getElementById("target"); 105 var body = document.body; 106 var html = document.documentElement; 107 var eventLog = []; 108 function captureEvent(e) { 109 eventLog.push([e.type, e.composedPath()]); 110 } 111 const pathToTarget = [ target, area, body, html, document, window ]; 112 const pathToArea = [ area, body, html, document, window ]; 113 var expectedEvents = [ 114 ["pointerdown", pathToTarget], 115 ["touchstart", pathToTarget], 116 ["pointerup", pathToArea], 117 ["touchend", pathToTarget], 118 ["mousedown", pathToTarget], 119 ["mouseup", pathToTarget], 120 ["click", pathToTarget], 121 ]; 122 123 window.addEventListener("pointerdown", 124 function(e) { 125 captureEvent(e); 126 pid = e.pointerId; 127 area.setPointerCapture(pid); 128 }, { once: true}); 129 window.addEventListener("touchstart", function(e) { 130 captureEvent(e); 131 }, { once: true}); 132 window.addEventListener("pointerup", 133 function(e) { 134 captureEvent(e); 135 try { 136 area.releasePointerCapture(pid); 137 } catch(ex) {} 138 }, { once: true}); 139 window.addEventListener("touchend", function(e) { 140 captureEvent(e); 141 }, { once: true}); 142 window.addEventListener("mousedown", 143 function(e) { 144 captureEvent(e); 145 }, { once: true}); 146 window.addEventListener("mouseup", function(e) { 147 captureEvent(e); 148 }, { once: true}); 149 window.addEventListener("click", function(e) { 150 captureEvent(e); 151 }, { once: true}); 152 153 synthesizeTouchAtCenter(target, {}, window); 154 155 opener.is(eventLog.length, expectedEvents.length, 156 "[topLevelDocumentEventHandlingWithTouch] Same number events expected."); 157 for (var i = 0; i < eventLog.length; ++i) { 158 opener.is(eventLog[i][0], expectedEvents[i][0], 159 `topLevelDocumentEventHandlingWithTouch ${i}`); 160 for (var j = 0; j < eventLog[i][1].length; ++j) { 161 opener.is(eventLog[i][1][j], expectedEvents[i][1][j], 162 `topLevelDocumentEventHandlingWithTouch ${i} ${j}`); 163 } 164 } 165 next(); 166 } 167 168 function iframeEventHandling() { 169 var pid; 170 var iframe = document.getElementById("iframe"); 171 var doc = iframe.contentDocument; 172 doc.head.innerHTML = "<style>" + document.getElementsByTagName("style")[0].textContent + "</style>"; 173 var area = doc.createElement("div"); 174 area.id = "area"; 175 var target = doc.createElement("div"); 176 target.id = "target"; 177 area.appendChild(target); 178 doc.body.appendChild(area); 179 var body = doc.body; 180 var html = doc.documentElement; 181 var win = doc.defaultView; 182 var eventLog = []; 183 function captureEvent(e) { 184 eventLog.push([e.type, e.composedPath()]); 185 } 186 const pathToTarget = [ target, area, body, html, doc, win ]; 187 const pathToArea = [ area, body, html, doc, win ]; 188 var expectedEvents = [ 189 ["pointerdown", pathToTarget], 190 ["mousedown", pathToTarget], 191 ["pointerup", pathToArea], 192 ["mouseup", pathToArea], 193 ["click", pathToTarget], 194 ]; 195 196 win.addEventListener("pointerdown", 197 function(e) { 198 captureEvent(e); 199 pid = e.pointerId; 200 area.setPointerCapture(pid); 201 }, { once: true}); 202 win.addEventListener("mousedown", 203 function(e) { 204 captureEvent(e); 205 }, { once: true}); 206 win.addEventListener("pointerup", 207 function(e) { 208 captureEvent(e); 209 area.releasePointerCapture(pid); 210 }, { once: true}); 211 win.addEventListener("mouseup", function(e) { 212 captureEvent(e); 213 }, { once: true}); 214 win.addEventListener("click", function(e) { 215 captureEvent(e); 216 }, { once: true}); 217 218 synthesizeMouseAtCenter(target, {}, win); 219 220 opener.is(eventLog.length, expectedEvents.length, 221 "[iframeEventHandling] Same number events expected."); 222 for (var i = 0; i < eventLog.length; ++i) { 223 opener.is(eventLog[i][0], expectedEvents[i][0], 224 `iframeEventHandling ${i}`); 225 for (var j = 0; j < eventLog[i][1].length; ++j) { 226 opener.is(eventLog[i][1][j], expectedEvents[i][1][j], 227 `iframeEventHandling ${i} ${j}`); 228 } 229 } 230 next(); 231 } 232 233 </script> 234 </head> 235 <body onload="start();"> 236 <div id="area"> 237 <div id="target"></div> 238 </div> 239 <iframe id="iframe"></iframe> 240 <h5 id="targetOutsideIframe"></h5> 241 </body> 242 </html>