| OLD | NEW |
| (Empty) |
| 1 <!doctype html> | |
| 2 <html lang="en"> | |
| 3 <head> | |
| 4 <style> | |
| 5 /* Make sure the console and the description don't interfere wit
h the rest of the layout. */ | |
| 6 #description { | |
| 7 position: absolute; | |
| 8 top: 0px; | |
| 9 } | |
| 10 | |
| 11 #console { | |
| 12 position: absolute; | |
| 13 top: 100px; | |
| 14 } | |
| 15 | |
| 16 .box { | |
| 17 width: 100px; | |
| 18 height: 100px; | |
| 19 } | |
| 20 #parent { | |
| 21 background-color: green; | |
| 22 } | |
| 23 #parent:hover { | |
| 24 color: red; | |
| 25 } | |
| 26 #child { | |
| 27 background-color: orange; | |
| 28 -webkit-flow-into: f; | |
| 29 } | |
| 30 #region { | |
| 31 -webkit-flow-from: f; | |
| 32 } | |
| 33 </style> | |
| 34 | |
| 35 <script src="../../resources/js-test.js"></script> | |
| 36 </head> | |
| 37 <body> | |
| 38 <ol> | |
| 39 <li>Move the mouse over the orange square</li> | |
| 40 <li>The text should turn red</li> | |
| 41 </ol> | |
| 42 <div class="box" id="parent"> | |
| 43 <div class="box" id="child">Red = hover</div> | |
| 44 </div> | |
| 45 <div class="box" id="region"></div> | |
| 46 | |
| 47 <script type="text/javascript"> | |
| 48 description("Test hover on child when flowed into region.") | |
| 49 | |
| 50 if (window.eventSender) { | |
| 51 var child = document.querySelector("#child"); | |
| 52 var parent = document.querySelector("#parent"); | |
| 53 | |
| 54 // move mouse on the child object | |
| 55 eventSender.mouseMoveTo(child.offsetLeft + 10, child.off
setTop + 50); | |
| 56 eventSender.mouseDown(0); | |
| 57 eventSender.leapForward(500); | |
| 58 eventSender.mouseUp(0); | |
| 59 | |
| 60 var computedStyle = window.getComputedStyle(parent); | |
| 61 var clr = computedStyle.getPropertyValue("color"); | |
| 62 if (clr == "rgb(255, 0, 0)") | |
| 63 testPassed("Hover event processed OK."); | |
| 64 else | |
| 65 testFailed("Hover event FAILED to process."); | |
| 66 } | |
| 67 | |
| 68 if (window.testRunner) { | |
| 69 var elementsToHide = document.querySelectorAll("ol, .box
"); | |
| 70 for (var i=0; i<elementsToHide.length; i++) | |
| 71 elementsToHide[i].style.visibility = "hidden"; | |
| 72 } | |
| 73 | |
| 74 else { | |
| 75 var elementsToHide = document.querySelectorAll("#console
, #description"); | |
| 76 for (var i=0; i<elementsToHide.length; i++) | |
| 77 elementsToHide[i].style.visibility = "hidden"; | |
| 78 } | |
| 79 </script> | |
| 80 | |
| 81 </body> | |
| 82 </html> | |
| OLD | NEW |