<!DOCTYPE html>
<html>
<body>
    <div style="height: 1000px;"></div>
    <script src="../../resources/js-test-pre.js"></script>
    <script>
        description("Test that requestAnimationFrame gets the right throttling in an iframe when when it's outside the viewport.");
        jsTestIsAsync = true;

        if (window.internals)
            internals.setOutsideViewportThrottlingEnabled(true);

        var framesPerSecond = 0;
        var iframeFramesPerSecond = 0;

        window.onmessage = function(e){
            if (e.data == 'subFrameRAFMessage') {
                ++iframeFramesPerSecond;
            }
        };

        const frame = document.createElement("iframe");
        frame.src = "resources/frame-with-animation-2.html";
        frame.onload = function() {
            var start = null;
            function doWork(timestamp) {
                if (!start)
                    start = timestamp;
                if (timestamp - start < 1000) {
                    ++framesPerSecond;
                    window.requestAnimationFrame(doWork);
                }
                else {
                    shouldBeTrue("framesPerSecond > 0");

                    // The OutsideViewport throttling = 10_s. subFrameRAFMessage
                    // should not ever be received during the first second.
                    shouldBeTrue("iframeFramesPerSecond == 0");
                    finishJSTest();
                }
            }
            window.requestAnimationFrame(doWork);
        }
        document.body.appendChild(frame);
    </script>
    <script src="../../resources/js-test-post.js"></script>
</body>
</html>
