<!DOCTYPE html>
<html>
    <head>
        <script src=media-file.js></script>
        <script src=video-test.js></script>
        <script src='../resources/ui-helper.js'></script>
        <script>
            function inputFileChanged(e) {
                findMediaElement();
                var file = e.target.files[0];
                waitForEventAndEnd('loadedmetadata');
                waitForEventAndFail('error');
                video.src = window.URL.createObjectURL(file);
            }

            function runTest() {
                var inputFile = document.getElementById('file');
                var centerX = inputFile.offsetLeft + inputFile.offsetWidth / 2;
                var centerY = inputFile.offsetTop + inputFile.offsetHeight / 2;
                waitForEvent('change', inputFileChanged, false, false, inputFile);

                if (window.testRunner) {
                    testRunner.setOpenPanelFiles([findMediaFile("video", "content/test")]);
                    UIHelper.activateAt(centerX, centerY);
                }
            }
        </script>
    </head>
    <body onload="runTest()">
        <div>
            This tests the ability of the &lt;video&gt; element to load blob URLs. In the browser, select a video file:
            <input type="file" name="file" id="file">
        </div>
        <video></video>
    </body>
</html>