| <style> |
| body { margin: 0; } |
| caption div { width: 50px; height: 50px; } |
| td { width: 50px; height: 25px; } |
| #console { margin: 8px; } |
| </style> |
| <table cellpadding="0" cellspacing="0" id="table"> |
| <tbody> |
| <tr> |
| <td id="1-1-1"></td> |
| <td id="1-1-2"></td> |
| <td id="1-1-3"></td> |
| </tr> |
| <tr> |
| <td id="1-2-1"></td> |
| <td id="1-2-2"></td> |
| <td id="1-2-3"></td> |
| </tr> |
| </tbody> |
| <tbody> |
| <tr> |
| <td id="2-1-1"></td> |
| <td id="2-1-2"></td> |
| <td id="2-1-3"></td> |
| </tr> |
| </tbody> |
| <caption id="c"> |
| <div></div> |
| </caption> |
| </table> |
| <pre id="console"></pre> |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| function log(message) |
| { |
| document.getElementById("console").appendChild(document.createTextNode(message + "\n")); |
| } |
| |
| function checkElementAtPoint(x, y, id) |
| { |
| var actualID = document.elementFromPoint(x, y).id; |
| if (actualID === id) |
| log("PASS: " + id + " at (" + x + ", " + y + ")"); |
| else |
| log("FAIL: " + actualID + " instead of " + id + " at (" + x + ", " + y + ")"); |
| } |
| |
| var style = document.getElementById("table").style; |
| |
| checkElementAtPoint(1, 1, "c"); |
| checkElementAtPoint(1, 51, "1-1-1"); |
| checkElementAtPoint(51, 51, "1-1-2"); |
| checkElementAtPoint(101, 51, "1-1-3"); |
| checkElementAtPoint(1, 76, "1-2-1"); |
| checkElementAtPoint(51, 76, "1-2-2"); |
| checkElementAtPoint(101, 76, "1-2-3"); |
| checkElementAtPoint(1, 101, "2-1-1"); |
| checkElementAtPoint(51, 101, "2-1-2"); |
| checkElementAtPoint(101, 101, "2-1-3"); |
| |
| log("\nTesting horizontal-bt:"); |
| style.webkitWritingMode = "horizontal-bt"; |
| checkElementAtPoint(1, 101, "c"); |
| checkElementAtPoint(1, 51, "1-1-1"); |
| checkElementAtPoint(51, 51, "1-1-2"); |
| checkElementAtPoint(101, 51, "1-1-3"); |
| checkElementAtPoint(1, 26, "1-2-1"); |
| checkElementAtPoint(51, 26, "1-2-2"); |
| checkElementAtPoint(101, 26, "1-2-3"); |
| checkElementAtPoint(1, 1, "2-1-1"); |
| checkElementAtPoint(51, 1, "2-1-2"); |
| checkElementAtPoint(101, 1, "2-1-3"); |
| |
| log("\nTesting vertical-lr:"); |
| style.webkitWritingMode = "vertical-lr"; |
| checkElementAtPoint(1, 1, "c"); |
| checkElementAtPoint(51, 1, "1-1-1"); |
| checkElementAtPoint(51, 26, "1-1-2"); |
| checkElementAtPoint(51, 51, "1-1-3"); |
| checkElementAtPoint(101, 1, "1-2-1"); |
| checkElementAtPoint(101, 26, "1-2-2"); |
| checkElementAtPoint(101, 51, "1-2-3"); |
| checkElementAtPoint(151, 1, "2-1-1"); |
| checkElementAtPoint(151, 26, "2-1-2"); |
| checkElementAtPoint(151, 51, "2-1-3"); |
| |
| log("\nTesting vertical-rl:"); |
| style.webkitWritingMode = "vertical-rl"; |
| checkElementAtPoint(151, 1, "c"); |
| checkElementAtPoint(101, 1, "1-1-1"); |
| checkElementAtPoint(101, 26, "1-1-2"); |
| checkElementAtPoint(101, 51, "1-1-3"); |
| checkElementAtPoint(51, 1, "1-2-1"); |
| checkElementAtPoint(51, 26, "1-2-2"); |
| checkElementAtPoint(51, 51, "1-2-3"); |
| checkElementAtPoint(1, 1, "2-1-1"); |
| checkElementAtPoint(1, 26, "2-1-2"); |
| checkElementAtPoint(1, 51, "2-1-3"); |
| </script> |