test_bug656379-2.html (3798B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=656379 5 --> 6 <head> 7 <title>Test for Bug 656379</title> 8 <script src="/tests/SimpleTest/SimpleTest.js"></script> 9 <script src="/tests/SimpleTest/EventUtils.js"></script> 10 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 11 <style> 12 input[type="button"]:hover { color: green; } 13 </style> 14 </head> 15 <body> 16 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=656379">Mozilla Bug 656379</a> 17 <p id="display"> 18 <label for="button1" id="label1">Label 1</label> 19 <input type="button" id="button1" value="Button 1"> 20 <label> 21 <span id="label2">Label 2</span> 22 <input type="button" id="button2" value="Button 2"> 23 </label> 24 </p> 25 <div id="content" style="display: none"> 26 27 </div> 28 <pre id="test"> 29 <script type="application/javascript"> 30 31 function log(aEvent) { 32 function getPath() { 33 if (!aEvent.target) { 34 return "(null)"; 35 } 36 function getNodeName(aNode) { 37 if (aNode.id) { 38 return `${aNode.nodeName}#${aNode.id}`; 39 } 40 return aNode.nodeName; 41 } 42 let path = getNodeName(aEvent.target); 43 for (let parent = aEvent.target.parentElement; 44 parent && document.body != parent; 45 parent = parent.parentElement) { 46 path = `${getNodeName(parent)} > ${path}`; 47 } 48 return path; 49 } 50 info(`${aEvent.type} on ${getPath()}`); 51 } 52 53 window.addEventListener("mousemove", log, {capture: true}); 54 window.addEventListener("mouseenter", log, {capture: true}); 55 window.addEventListener("mouseleave", log, {capture: true}); 56 window.addEventListener("mouseover", log, {capture: true}); 57 window.addEventListener("mouseout", log, {capture: true}); 58 59 /** Test for Bug 656379 */ 60 SimpleTest.waitForExplicitFinish(); 61 function* tests() { 62 info("Synthesizing mousemove on label1..."); 63 synthesizeMouseAtCenter($("label1"), { type: "mousemove" }); 64 yield undefined; 65 is($("button1").matches(":hover"), true, 66 "Button 1 should be hovered after mousemove over label1"); 67 is($("label1").matches(":hover"), true, 68 "Label 1 should be hovered after mousemove over label1"); 69 is($("button2").matches(":hover"), false, 70 "Button 2 should not be hovered after mousemove over label1"); 71 is($("label2").matches(":hover"), false, 72 "Label 2 should not be hovered after mousemove over label1"); 73 info("Synthesizing mousemove on button2..."); 74 synthesizeMouseAtCenter($("button2"), { type: "mousemove" }); 75 yield undefined; 76 is($("button1").matches(":hover"), false, 77 "Button 1 should not be hovered after mousemove over button2"); 78 is($("label1").matches(":hover"), false, 79 "Label 1 should not be hovered after mousemove over button2"); 80 is($("button2").matches(":hover"), true, 81 "Button 2 should be hovered after mousemove over button2"); 82 is($("label2").matches(":hover"), false, 83 "Label 2 should not be hovered after mousemove over label2"); 84 info("Synthesizing mousemove on label2..."); 85 synthesizeMouseAtCenter($("label2"), { type: "mousemove" }); 86 yield undefined; 87 is($("button1").matches(":hover"), false, 88 "Button 1 should not be hovered after mousemove over label2"); 89 is($("label1").matches(":hover"), false, 90 "Label 1 should not be hovered after mousemove over label2"); 91 is($("button2").matches(":hover"), true, 92 "Button 2 should be hovered after mousemove over label2"); 93 is($("label2").matches(":hover"), true, 94 "Label 2 should be hovered after mousemove over label2"); 95 SimpleTest.finish(); 96 } 97 98 function executeTests() { 99 var testYielder = tests(); 100 function execNext() { 101 let {done} = testYielder.next(); 102 if (done) { 103 return; 104 } 105 SimpleTest.executeSoon(execNext); 106 } 107 execNext(); 108 } 109 110 SimpleTest.waitForFocus(executeTests); 111 112 </script> 113 </pre> 114 </body> 115 </html>