<!DOCTYPE html>
<html>
<head>
<title>Document::nodesFromRect : Allow child-frame content - bug 95204</title>
<script src="../../../resources/js-test.js"></script>
<script src="resources/nodesFromRect.js"></script>
<style>
body { margin: 0px; }
#sandbox {
width: 400px;
height: 200px;
}
#sandbox #layer {
float: right;
}
#sandbox iframe {
display: block;
box-sizing: border-box;
width: 200px;
height: 200px;
border: none;
}
.rotate180 { transform: rotate(180deg); }
.rotate90 { transform: rotate(90deg); }
#sandbox .box {
box-sizing: border-box;
height: 100px;
width: 200px;
border: 1px solid black;
}
</style>
</head>
<body id="body">
<div id=sandbox>
<div id=layer>
<iframe id="iframe1" src="resources/child-frame.html"></iframe>
</div>
<div id=div1 class=box></div>
<div id=div2 class=box></div>
</div>
<p id='description'></p>
<div id="console"></div>
<script type="application/javascript">
function runTest()
{
description(document.title);
// Set up shortcut access to elements
var e = {};
['sandbox', 'layer'].forEach(function(a) {
e[a] = document.getElementById(a);
});
checkRect(25, 25, 100, 100, "DIV#div2, DIV#div1, DIV#sandbox");
checkRect(220, 20, 70, 70, "DIV#left");
checkRect(250, 20, 100, 70, "DIV#right, DIV#left, HTML");
checkRect(150, 50, 100, 100, "DIV#left, HTML, #document, IFRAME#iframe1, DIV#layer, DIV#div2, DIV#div1, DIV#sandbox");
e.layer.setAttribute('class', 'rotate180');
checkRect(220, 20, 70, 70, "DIV#right");
checkRect(150, 50, 100, 100, "DIV#right, HTML, #document, IFRAME#iframe1, DIV#layer, DIV#div2, DIV#div1, DIV#sandbox");
e.layer.setAttribute('class', 'rotate90');
checkRect(250, 20, 100, 70, "DIV#left");
checkRect(150, 20, 200, 60, "DIV#left, HTML, #document, IFRAME#iframe1, DIV#layer, DIV#div1, DIV#sandbox");
e.sandbox.display = 'none';
finishJSTest();
}
jsTestIsAsync = true;
window.onload = runTest;
</script>
</body>
</html>