blob: 85987663b858beee4dec37fa0a4206d8b17f3b1a [file] [log] [blame]
<!-- webkit-test-runner [ useThreadedScrolling=false ] -->
<!DOCTYPE html>
<!--
This test checks that the contents of accelerated scrolling layers are properly
updated also outside the current overflow clip. See
https://bugs.webkit.org/show_bug.cgi?id=100524.
-->
<html>
<head>
<style type="text/css">
#scroller {
overflow: scroll;
-webkit-overflow-scrolling: touch;
width: 200px;
height: 200px;
}
#indicator {
background: red;
height: 200px;
}
#content {
height: 1000px;
}
</style>
<script type="text/javascript">
if (window.internals)
window.internals.settings.setAcceleratedCompositingForOverflowScrollEnabled(true);
window.addEventListener('load', function() {
if (!window.testRunner || !window.internals) {
alert('This test requires testRunner to run!');
return;
}
testRunner.dumpAsText(false);
var scroller = document.getElementById('scroller');
var indicator = document.getElementById('indicator');
// Make sure the scrolling content is painted before we start.
scroller.offsetTop;
// Scroll all the way to the bottom and change the color of the
// indicator (which is now outside the overflow clip).
scroller.scrollTop = 1000;
window.internals.startTrackingRepaints();
indicator.style.background = 'green';
// Scroll back up so that the updated (green) indicator is visible.
var layerTree = document.getElementById('layerTree');
scroller.scrollTop = 0;
layerTree.innerText =
window.internals.layerTreeAsText(document, internals.LAYER_TREE_INCLUDES_REPAINT_RECTS);
window.internals.stopTrackingRepaints();
});
</script>
</head>
<body>
<div id="scroller">
<div id="indicator"></div>
<div id="content"></div>
</div>
<pre id="layerTree">This text will be replaced with the layer tree.</pre>
</body>
</html>