<!DOCTYPE html><!-- webkit-test-runner [ enableModernMediaControls=false ] -->
<html>
    <head>
        <style>
            #no-video-media { background-color: yellow; width: 320px; height: 100px;} 
            #mouse-parking:hover { padding:8; background-color: blue; }
        </style>
        <script src=media-file.js></script>
        <script src=media-controls.js></script>
        <script>
            if (window.testRunner) {
                testRunner.dumpAsText();
                testRunner.waitUntilDone();
            }

            var video;

            function consoleWrite(text)
            {
                var console = document.getElementById("console");
                console.innerHTML += text + "<br>";
            }
            
            function testcondition(testFuncString, endit)
            {
                if (eval(testFuncString))
                    consoleWrite("TEST(" + testFuncString + ") <span style='color:green'>OK</span>");
                else
                    consoleWrite("TEST(" + testFuncString + ") <span style='color:red'>FAIL</span>");    
            }
            
            function start()
            {
                video = document.getElementById("no-video-media");

                testcondition("video.paused");
                if (!window.testRunner)
                    return;

                try {
                    clickPlayButton(video);
                } catch (exception) {
                    consoleWrite(exception.description);
                    testRunner.notifyDone();
                    return;
                }
                testcondition("!video.paused");

                // move the mouse off of the element
                target = document.getElementById("mouse-parking");
                eventSender.mouseMoveTo(target.offsetLeft + 4, target.offsetTop + 4);

                // controller should still be visible after a second
                setTimeout(function() { testRunner.notifyDone(); } , 1000);
            }

            if (window.testRunner) {
                setTimeout(function() { 
                    document.body.appendChild(document.createTextNode('FAIL')); 
                    if (window.testRunner)
                        testRunner.notifyDone();
                } , 8000);
            }

        </script>
    </head>
    <body >

        <p>Test video element control visibility when mouse is not over element.</p>
        <p>This test only runs in DRT!</p>

        <p><span id="mouse-parking">mouse parks here, am I blue?</span></p>

        <video id="no-video-media" controls loop oncanplaythrough="start()"></video>
        <br><br><div id="console"></div>
        <script>
            setSrcById("no-video-media", findMediaFile("audio", "content/test"));
        </script>
    </body>
</html>