<html>
<head>
<script>jsTestIsAsync = true;</script>
<script src="../../resources/js-test-pre.js"></script>

<script>
window.onload = function() {
    if (window.internals)
        window.internals.startTrackingRepaints();

    setTimeout(function() {
        document.querySelector('#scroll_inner').style.left = "100px";
        if (!window.testRunner || !window.internals)
            return;
        
        shouldBe("window.internals.repaintRectsAsText().indexOf('8 541 180 18')", "-1");
        window.internals.stopTrackingRepaints();
        finishJSTest();
    }, 10);
}
</script>
<style>
#scroll_container {
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    border: 1px solid black;
}
#scroll_inner {
    position: relative;
}

#innocent_repaint_victim {
    position: absolute;
    border: 1px solid green;
}
</style>
</head>
<body>
<div id="scroll_container">
    <span id="scroll_inner">
        this is scrolling and should be repainted.
    </span>
</div>

<!-- padding 512px so we get to the next tile -->
<div style="height: 512px;"></div>

<div id="innocent_repaint_victim">
    this should not be repainting
</div>
<pre id="repaints"></pre>
</body>
<script src="../../resources/js-test-post.js"></script>
</html>
