<script src="../../../resources/js-test.js"></script>
<style>
#pusher {
width: 1000px;
height: 1000px;
outline: 1px solid black;
}
</style>
<div id="console"></div>
<div id="testArea">
<br>
<p id="test">Test content</p>
<div id="pusher">This box is here to create scrollbars.</div>
</div>
<script>
if (window.testRunner)
testRunner.dumpAsText();
var range = document.createRange();
range.selectNodeContents(document.getElementById('test'));
// Get base numbers
var unScrolledBoundingBox = range.getBoundingClientRect();
var unScrolledBoundingBoxes = range.getClientRects();
// Test scrolling down
window.scrollBy(0, 50);
var scrolledDownBoundingBox = range.getBoundingClientRect();
var scrolledDownBoundingBoxes = range.getClientRects();
// Reset
window.scrollTo(0, 0);
// Test scrolling right
window.scrollBy(50, 0);
var scrolledRightBoundingBox = range.getBoundingClientRect();
var scrolledRightBoundingBoxes = range.getClientRects();
// Reset
window.scrollTo(0, 0);
shouldBe("unScrolledBoundingBox.top - scrolledDownBoundingBox.top", "50");
shouldBe("unScrolledBoundingBoxes[0].top - scrolledDownBoundingBoxes[0].top", "50");
shouldBe("unScrolledBoundingBox.left - scrolledRightBoundingBox.left", "50");
shouldBe("unScrolledBoundingBoxes[0].left - scrolledRightBoundingBoxes[0].left", "50");
if (window.testRunner) {
var area = document.getElementById('testArea');
area.parentNode.removeChild(area);
}
</script>