scroll-descendant-with-cached-cliprects.html

<!DOCTYPE html>
<script>
    if (window.testRunner) {
        window.enablePixelTesting = true;
        testRunner.waitUntilDone();
    }
    function repaintTest() {
        window.scrollBy(0,200);
        document.getElementById("scrollpanel").style.position = "fixed";
    }
</script>
<script type="text/javascript" src="../resources/text-based-repaint.js"></script>
<script type="text/javascript" src="../../../resources/run-after-layout-and-paint.js"></script>
<style>
    .left {
        float: left;
        min-height: 1843px;
    }

    .right {
        float: right;
        width: 100px;
    }

    .container {
        position: relative;
        overflow: hidden;
    }

    #ul {
        position: relative;
    }

    #scrollpanel {
        position: inherit;
    }
</style>
<body onload="runAfterLayoutAndPaint(runRepaintTest);">
    <p> When you scroll down the red square should have no painting glitches. </p>
    <div class="left"></div>
    <div class="right">
        <div id="scrollpanel">
            <div class="container">
                <div id="ul">
                    <div style="background-color: red; width: 100px; height:100px;"></div>
                </div>
            </div>

        </div>
    </div>
</body>

chromium/third_party/blink/web_tests/paint/invalidation/scroll/scroll-descendant-with-cached-cliprects.html