<script src="../resources/run-after-layout-and-paint.js"></script>
<style>
#parent {
height: 300px;
backface-visibility: hidden;
overflow: auto;
background-color: #aaa;
padding: 10px;
}
.child {
height: 300px;
margin: 5px 0;
background-color: red;
position: relative;
}
</style>
<div id="parent">
<div class="child"></div>
<div class="child"></div>
<div id="target"class="child"></div>
</div>
<script>
if (window.testRunner)
testRunner.waitUntilDone();
// The target element should be displayed as red, not gray.
runAfterLayoutAndPaint(function() {
target.scrollIntoView(true);
runAfterLayoutAndPaint(function() {
testRunner.notifyDone();
});
});
</script>