| <html><!-- webkit-test-runner [ TabsToLinks=true SpatialNavigationEnabled=true ] --> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| <script src="resources/spatial-navigation-utils.js"></script> |
| <script type="application/javascript"> |
| |
| var resultMap = [ |
| ["Down", "f2"], |
| ["Down", "f3"], |
| ["Down", "f3"], |
| ["Down", "f4"], |
| ["Down", "f4"], |
| ["Down", "f5"], |
| ["Down", "f6"], |
| ["Down", "f9"], |
| ["DONE", "DONE"] |
| ]; |
| |
| if (window.testRunner) { |
| testRunner.dumpAsText(); |
| testRunner.waitUntilDone(); |
| } |
| |
| function runTest() |
| { |
| // starting the test itself: get to a known place. |
| document.getElementById("start").focus(); |
| |
| initTest(resultMap, testCompleted); |
| } |
| |
| function testCompleted() |
| { |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| } |
| |
| window.onload = runTest; |
| </script> |
| <script src="../resources/js-test-post.js"></script> |
| <style> |
| div.overflow1 {overflow:auto; height:100px; width:200px; border: 1px solid cyan;} |
| div.overflow2 {overflow:hidden; height:80px; width:150px; border: 1px solid cyan;} |
| div:focus { outline: 2px solid red;} |
| </style> |
| </head> |
| |
| <body> |
| <div class="overflow1"> |
| <div><a href="#" id="start"><img src="resources/green.png" width=40px; height=40px;></a></div> |
| <div><a href="#" id="f2"><img src="resources/green.png" width=50px; height=40px;></a></div> |
| <div><a href="#" id="f3"><img src="resources/green.png" width=40px; height=40px;></a></div> |
| <br> |
| <div><a href="#" id="f4"><img src="resources/green.png" width=50px; height=40px;></a></div> |
| <div class="overflow2"> |
| <div><a href="#" id="f5"><img src="resources/green.png" width=40px; height=40px;></a></div> |
| <div><a href="#" id="f6"><img src="resources/green.png" width=50px; height=40px;></a></div> |
| <br> |
| <div><a href="#" id="f7"><img src="resources/green.png" width=40px; height=40px;></a></div> |
| <div><a href="#" id="f8"><img src="resources/green.png" width=50px; height=40px;></a></div> |
| </div><br> |
| <div><a href="#" id="f9"><img src="resources/green.png" width=40px; height=40px;></a></div> |
| </div></div> |
| <div id="console"></div> |
| This test is testing that div with overflow:auto would scroll, by div with overflow:hidden would not. |
| </body> |
| </html> |
| |
