blob: a87b9017c6dadc6ab62020bee95591a52c5e6eae [file] [log] [blame]
<!DOCTYPE html>
<style>
.container {
width: 100px;
height:100px;
position:absolute;
-webkit-transform:translateZ(0);
overflow:auto;
}
.content {
-webkit-transform: translateZ(0);
position:absolute;
width:10px;
height:10px;
}
.tall {
height:200px;
}
.wide {
width:200px;
}
.resizeWidget {
resize: both;
}
</style>
<pre id="layerTree"></pre>
<div class="container">
<div id="vertical" class="content"></div>
</div>
<div class="container">
<div id="horizontal" class="content"></div>
</div>
<div class="container">
<div id="both" class="content"></div>
</div>
<div id="corner" class="container">
<div class="content"></div>
</div>
<script>
function finishTest() {
document.getElementById("vertical").classList.add("tall"); // topmost div gets a vertical scrollbar
document.getElementById("horizontal").classList.add("wide"); // second div gets a horizontal scrollbar
document.getElementById("both").classList.add("wide"); // third div gets both
document.getElementById("both").classList.add("tall"); // vertical and horizontal scrollbars
document.getElementById("corner").classList.add("resizeWidget"); // bottom div gets a resize corner but no scrollbars
if (window.testRunner) {
testRunner.displayAndTrackRepaints(); // Ensure compositor tree is up to date.
document.getElementById("layerTree").innerText = window.internals.layerTreeAsText(document);
}
}
if (window.testRunner) {
testRunner.dumpAsText();
testRunner.displayAndTrackRepaints(); // Force compositor state to be updated before the container needs any overflow controls
finishTest();
} else
window.setTimeout(finishTest, 0);
</script>