blob: 4430840456f05deb55ad7f42b1c06289ccb2071b [file] [log] [blame]
<!DOCTYPE HTML>
<html>
<head>
<style>
#parent {
position: absolute;
background: blue;
width: 150px;
height: 150px;
top: 75px;
left: 50px;
}
#child {
position: absolute;
background: red;
top: 30px;
left: 25px;
width: 100px;
height: 50px;
}
</style>
</head>
<script src='test.js'></script>
<script src='get_element_location.js'></script>
<script>
function testGetFirstNonZeroWidthHeightRectDefault() {
var rects = [{id: 1}];
var rect = getFirstNonZeroWidthHeightRect(rects);
assertEquals(rect, rects[0]);
}
function testGetFirstNonZeroWidthHeightRectSecond() {
var rects = [{id: 1, width: 0, height: 0},
{id: 2, width: 1, height: 1}];
var rect = getFirstNonZeroWidthHeightRect(rects);
assertEquals(rect, rects[1]);
}
function testGetFirstNonZeroWidthHeightRectThird() {
var rects = [{id: 1, width: 0, height: 1},
{id: 2, width: 1, height: 0},
{id: 3, width: 1, height: 1}];
var rect = getFirstNonZeroWidthHeightRect(rects);
assertEquals(rect, rects[2]);
}
function testElementParentCenterLocation() {
var parent = document.getElementById('parent');
var location = getElementLocation(parent, true);
var x = 50 + 0.5 * 150;
var y = 75 + 0.5 * 150;
assertEquals(Math.floor(x), Math.floor(location.x));
assertEquals(Math.floor(y), Math.floor(location.y));
}
function testElementChildCenterLocation() {
var child = document.getElementById('child');
var location = getElementLocation(child, true);
var x = 75 + 0.5 * 100;
var y = 105 + 0.5 * 50;
assertEquals(Math.floor(x), Math.floor(location.x));
assertEquals(Math.floor(y), Math.floor(location.y));
}
function testElementParentTopLeftLocation() {
var parent = document.getElementById('parent');
var location = getElementLocation(parent, false);
var x = 50;
var y = 75;
assertEquals(Math.floor(x), Math.floor(location.x));
assertEquals(Math.floor(y), Math.floor(location.y));
}
function testElementChildCenterTopLeftLocation() {
var child = document.getElementById('child');
var location = getElementLocation(child, false);
var x = 75;
var y = 105;
assertEquals(Math.floor(x), Math.floor(location.x));
assertEquals(Math.floor(y), Math.floor(location.y));
}
</script>
<body>
<h2>position: absolute;</h2>
<p>The Parent element has position: absolute.</p>
<div id="parent">Parent: position: absolute, top: 75px, left: 50px.
<div id="child">Child: position: absolute, top: 30px, left: 25px.</div>
</div>
</body>
</html>