<!DOCTYPE html>
<html>
<head>
    <style>
        body, html {
            height: 100%;
            width: 100%;
            margin: 0;
        }
        .section {
            height: 2000px;
        }
        .overlay {
            position: fixed;
            left: 0;
            top: 0;
            width: 400px;
            height: 100px;
            background-color: blue;
        }
    </style>
    <script>
        if (window.testRunner)
            testRunner.waitUntilDone();

        function doTest()
        {
            window.scrollTo(0, 200);
            requestAnimationFrame(() => {
                document.body.style.top = -window.scrollY + 'px';
                document.body.style.position = 'fixed';

                if (window.testRunner)
                    testRunner.notifyDone();
            });
        }
        
        window.addEventListener('load', doTest, false);
    </script>
</head>
<body>
    <div class="section"></div>
    <div class="overlay"></div>
</body>
</html>

