<html>
    <head>
        <script src="media-file.js"></script>
        <script src="video-test.js"></script>
        <script>
            function start()
            {
                findMediaElement();
                consoleWrite('** setting video.src');
                video.src = findMediaFile('video', 'content/test');

                waitForEventOnce('play', play1);
                run('internals.setMediaElementRestrictions(video, "InvisibleAutoplayNotPermitted")');
                consoleWrite('');
            }

            function play1()
            {
                run('video.style.display = "none"');
                waitForEventOnce('pause', pause1);
            }

            function pause1()
            {
                run('video.style.removeProperty("display")')
                waitForEventOnce('play', play2);
            }

            function play2()
            {
                run('video.style.visibility = "hidden"');
                waitForEventOnce('pause', pause2);
            }

            function pause2()
            {
                run('video.style.removeProperty("visibility")');
                waitForEventOnce('play', play3);
            }

            function play3()
            {
                run('document.documentElement.style.height = window.innerHeight + 20 + video.offsetHeight');
                run('window.scrollBy(0, 20 + video.offsetHeight)');
                waitForEventOnce('pause', pause3);
            }

            function pause3()
            {
                run('window.scrollTo(0, 0)');
                waitForEventOnce('play', endTest);
            }
        </script>
    </head>

    <body onload="start()">
        <video controls autoplay></video>
        <p>Test that "invisible autoplay not allowed restriction" pauses media when scrolled out of view.</p>
    </body>
</html>