| <!DOCTYPE html> |
| <script src="../../resources/js-test.js"></script> |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| </script> |
| <body style="margin-left:10px; margin-top:15px;"> |
| <div style="-webkit-columns:3; columns:3;" id="mc"> |
| <div id="elm1" class="rodent">elm1</div> |
| <br> |
| <div> |
| <div id="elm2" class="rodent">elm2</div> |
| <div id="elm3" class="rodent">elm3</div> |
| </div> |
| <div id="elm4" class="rodent">elm4</div> |
| <div id="elm5" class="rodent">elm5</div> |
| </div> |
| <p id="console"></p> |
| <script> |
| var mc = document.getElementById('mc'); |
| var elm1 = document.getElementById('elm1'); |
| var elm2 = document.getElementById('elm2'); |
| var elm3 = document.getElementById('elm3'); |
| var elm4 = document.getElementById('elm4'); |
| var elm5 = document.getElementById('elm5'); |
| shouldBe("mc.offsetLeft", "10"); |
| shouldBe("mc.offsetTop", "15"); |
| |
| shouldBe("elm1.offsetLeft", "mc.offsetLeft"); |
| shouldBe("elm1.offsetTop", "mc.offsetTop"); |
| shouldBeGreaterThan("elm2.offsetLeft", "elm1.offsetLeft"); |
| shouldBe("elm2.offsetTop", "elm1.offsetTop"); |
| shouldBe("elm3.offsetLeft", "elm2.offsetLeft"); |
| shouldBeGreaterThan("elm3.offsetTop", "elm2.offsetTop"); |
| shouldBeGreaterThan("elm4.offsetLeft", "elm3.offsetLeft"); |
| shouldBe("elm4.offsetTop", "elm1.offsetTop"); |
| shouldBe("elm5.offsetLeft", "elm4.offsetLeft"); |
| shouldBe("elm5.offsetTop", "elm3.offsetTop"); |
| |
| var elements = document.getElementsByClassName('rodent'); |
| for (var i = 0; i < elements.length; i++) { |
| var rects = elements[i].getClientRects(); |
| shouldBe("rects.length", "1"); |
| shouldBe("rects[0].left", "elements[i].offsetLeft"); |
| shouldBe("rects[0].top", "elements[i].offsetTop"); |
| } |
| </script> |
| </body> |
