test_bug1529036.html (2777B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=1529036 5 --> 6 <head> 7 <meta charset="utf-8"> 8 <title>Test for Bug 1529036</title> 9 <script src="/tests/SimpleTest/SimpleTest.js"></script> 10 <script src="/tests/SimpleTest/EventUtils.js"></script> 11 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 12 <style> 13 html,body { 14 color:black; background-color:white; font:16px/1 monospace; padding:0; margin:0; 15 } 16 </style> 17 <script type="application/javascript"> 18 19 /** Test for Bug 1529036 */ 20 21 function doTest() { 22 SimpleTest.waitForExplicitFinish(); 23 24 var clicks = 0; 25 var elms = document.querySelectorAll('.click'); 26 for (var i = 0; i < elms.length; ++i) { 27 var e = elms[i]; 28 e.addEventListener('click', function(event) { 29 ++clicks; 30 }); 31 } 32 33 var elms = document.querySelectorAll('.click.hit'); 34 for (var i = 0; i < elms.length; ++i) { 35 var e = elms[i]; 36 let r = e.getBoundingClientRect(); 37 synthesizeMouse(e, 50, 50, {}); 38 } 39 is(clicks, elms.length, "click events on overflow"); 40 41 clicks = 0; 42 elms = document.querySelectorAll('.click.nohit'); 43 for (var i = 0; i < elms.length; ++i) { 44 var e = elms[i]; 45 let r = e.getBoundingClientRect(); 46 synthesizeMouse(e, 50, 50, {}); 47 } 48 is(clicks, 0, "click events on clipped overflow"); 49 50 SimpleTest.finish(); 51 } 52 </script> 53 </head> 54 <body onload="SimpleTest.waitForFocus(doTest, window)"> 55 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1529036">Mozilla Bug 1529036</a> 56 <p id="display"></p> 57 <div id="content" style="display: none"> 58 59 </div> 60 <pre id="test"> 61 </pre> 62 63 <div style="border: 1px solid"> 64 <button class="click hit" id="t1" style="width:10px; height:10px; padding:20px; border-radius:50%"><div>button<br>button<br>button<br>button<br>button<br></div></button> 65 <button class="click hit" id="t2" style="width:10px; height:10px; padding:20px; border:1px solid"><div>button<br>button<br>button<br>button<br>button<br></div></button> 66 <button class="click hit" id="t3" style="width:10px; height:10px; border-width:20px; border-radius:50%"><div>button<br>button<br>button<br>button<br>button<br></div></button> 67 <button class="click hit" id="t4" style="width:10px; height:10px; border:20px solid"><div>button<br>button<br>button<br>button<br>button<br></div></button> 68 <button class="click nohit" id="t5" style="width:10px; height:10px; padding:20px; overflow:hidden; border-radius:50%"><div>button<br>button<br>button<br>button<br>button<br></div></button> 69 <button class="click nohit" id="t6" style="width:10px; height:10px; padding:20px; overflow:hidden; border:1px solid"><div>button<br>button<br>button<br>button<br>button<br></div></button> 70 </div> 71 72 </body> 73 </html>