| <html> |
| <head> |
| <style> |
| #table-row:hover { |
| background-color:blue; |
| } |
| </style> |
| <script> |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| testRunner.dumpAsText(); |
| } |
| function log(msg) { |
| var console = document.getElementById('console'); |
| console.innerText = msg; |
| } |
| var testedHoverState = false; |
| function testHoverState() { |
| if (testedHoverState) |
| return; |
| testedHoverState = true; |
| var tableRow = document.getElementById('table-row'); |
| var calculatedStyle = window.getComputedStyle(tableRow); |
| |
| if (calculatedStyle.getPropertyValue('background-color') == "rgb(0, 0, 255)") |
| log("PASSED: The hover effect works!"); |
| else |
| log("FAILED: The hover effect did not correctly propagate down the layer chain."); |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| } |
| |
| function runTest() { |
| if (!window.testRunner) |
| return; |
| document.body.offsetTop; // Force layout. |
| var targetElem = document.getElementById('table-row'); |
| eventSender.mouseMoveTo(50, 17); |
| window.setTimeout(testHoverState, 100); |
| } |
| </script> |
| </head> |
| |
| <body onload="runTest()"> |
| <div style="overflow:hidden"> |
| <div id="table-row" style="overflow:hidden; display:table-row">To test this manually, first make sure you can see this text at all, and then hover over it and make sure the background turns blue.</div> |
| </div> |
| <div id="console"></div> |
| |
| </body> |
| </html> |
