<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->
<script src="../../../resources/js-test-pre.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<body>
<iframe src="../../content/test.mp4" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"></iframe>
<script type="text/javascript">

description("Testing the size of the media element in a video media document on iPhone.");

window.jsTestIsAsync = true;

let media;

(function runTestIfReady() {
    const iframe = document.querySelector("iframe");
    media = iframe.contentDocument.querySelector("video");

    if (!media) {
        setTimeout(runTestIfReady);
        return;
    }

    shouldBecomeEqualToString("getComputedStyle(media).height", "240px", () => {
        shouldBeEqualToString("getComputedStyle(media).width", "320px");

        debug("");
        iframe.remove();
        finishJSTest();
    });

})();

</script>
<script src="../../../resources/js-test-post.js"></script>
</body>