| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>hover ancestor test</title> |
| <style type="text/css" media="screen"> |
| .foo { |
| background: red; |
| width: 300px; |
| height: 300px; |
| position: relative; |
| } |
| |
| .foo:hover { |
| background: green; |
| } |
| </style> |
| </head> |
| <body> |
| <p>This test ensures that ancestor element hover rules are not affected when we hover |
| its contained elements</p> |
| <div class="foo" id="target"> |
| <select class="select" id="testselect" size="3"> |
| <option value="option1">option1</option> |
| <option value="option1">option2</option> |
| <option selected="selected" value="option2">option3</option> |
| </select> |
| <br> |
| <input type="text" name="fname" id="testinput"/> |
| <br> |
| <textarea rows="2" cols="20" id="testtextarea">Textarea test.</textarea> |
| <br> |
| <a id="testanchor" href="webkit.org">http://www.webkit.org</a> |
| <br> |
| <button type="button" id="testbutton">Button test</button> |
| <br> |
| <form> |
| <input type="radio" id="testradio"/>Radio test |
| <br> |
| <input type="checkbox" id="testcheckbox"/>Checkbox test |
| <br> |
| </form> |
| </div> |
| <script type="text/javascript"> |
| if (window.testRunner) { |
| testRunner.dumpAsText(); |
| } |
| |
| function getCenterFor(element) |
| { |
| var rect = element.getBoundingClientRect(); |
| return { x : parseInt((rect.left + rect.right) / 2) , y : parseInt((rect.top + rect.bottom) / 2)}; |
| } |
| |
| function runTest(id) { |
| var box, x, y; |
| box = document.getElementById(id); |
| center = getCenterFor(box); |
| eventSender.mouseMoveTo(center.x, center.y); |
| var target = document.getElementById("target"); |
| var style = window.getComputedStyle(target, null); |
| var bgColor = style.getPropertyValue("background-color"); |
| logResult(id, bgColor); |
| } |
| |
| function logResult(id, bgColor) { |
| document.write(id + ': '); |
| document.write(bgColor=="rgb(0, 128, 0)" ? "PASS" : "FAIL"); |
| document.write('<br>'); |
| } |
| |
| if (window.eventSender) { |
| runTest("testselect"); |
| runTest("testinput"); |
| runTest("testtextarea"); |
| runTest("testanchor"); |
| runTest("testbutton"); |
| runTest("testradio"); |
| runTest("testcheckbox"); |
| } |
| </script> |
| </body> |
| </html> |