video-size.html | Explore in Territory

<!DOCTYPE html>
<title>Test "video" element size with and without "src" and "poster" attributes.</title>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<body>
<script>
var movieInfo = [
    {
        src: null,
        poster: null,
        description: "no 'src' and no 'poster', with 'width' and 'height' attributes",
        width: 640,
        height: 480,
        videoWidth: 0,
        videoHeight: 0,
        setSize: true
    },
    {
        src: null,
        poster: null,
        description: "no 'src' and no 'poster', with no 'width' and 'height' attributes, should be default size",
        width: 300,
        height: 150,
        videoWidth: 0,
        videoHeight: 0
    },
    {
        src: null,
        poster: "content/abe.png",
        description: "'poster' but no 'src', should be 'poster' size",
        width: 76,
        height: 103,
        videoWidth: 0,
        videoHeight: 0
    },
    {
        src: "content/test.ogv",
        poster: "content/abe.png",
        play: false,
        description: "'poster' and 'src', should be 'poster' size before play",
        width: 76,
        height: 103,
        videoWidth: 320,
        videoHeight: 240
    },
    {
        src: "content/test.ogv",
        poster: "content/abe.png",
        play: true,
        description: "'poster' and 'src', should be 'video' size after play",
        width: 320,
        height: 240,
        videoWidth: 320,
        videoHeight: 240
    },
    {
        src: "content/bogus.ogv",
        poster: "content/greenbox.png",
        description: "'poster' and invalid 'src', should be 'poster' size",
        width: 25,
        height: 25,
        videoWidth: 0,
        videoHeight: 0
    }
];

movieInfo.forEach(function(movie) {
    async_test(function(t) {
        if (movie.poster) {
            var image = document.createElement("img");
            image.src = movie.poster;
            document.body.appendChild(image);
            image.onload = t.step_func(runTest);
        } else {
            runTest();
        }

        function runTest() {
            var video = document.createElement("video");
            document.body.appendChild(video);
            if (movie.setSize) {
                video.setAttribute("width", "640");
                video.setAttribute("height", "480");
            }

            if (movie.src)
                video.src = movie.src;

            if (movie.poster)
                video.poster = movie.poster;

            if (movie.play) {
                video.onplaying = t.step_func_done(testMovieSize);
                video.play();
            } else {
                video.onloadedmetadata = t.step_func_done(testMovieSize);
            }

            if (!movie.src || movie.src.indexOf("bogus") >= 0) {
                setTimeout(t.step_func_done(testMovieSize), 0);
            }

            function testMovieSize() {
                assert_equals(video.clientWidth, movie.width);
                assert_equals(video.clientHeight, movie.height);
                assert_equals(video.videoWidth, movie.videoWidth);
                assert_equals(video.videoHeight, movie.videoHeight);
            }
        }
    }, movie.description);
});
</script>
chromium/third_party/blink/web_tests/media/video-size.html
