video-canvas-draw.html | Explore in Territory

<!DOCTYPE html>
<html>
<head>
<script>

if (window.testRunner) {
    testRunner.waitUntilDone();
}

function onLoad() {
    var video = document.getElementsByTagName('video')[0];
    video.src = "content/test.ogv";

    var canvas1 = document.getElementById('canvas1');
    var canvas2 = document.getElementById('canvas2');
    var ctx1 = canvas1.getContext('2d');
    var ctx2 = canvas2.getContext('2d');

    video.load();
    video.addEventListener("canplay", function (e) {
        ctx1.fillStyle = ctx1.createPattern(video, 'repeat');
        ctx1.fillRect(0, 0, 320, 240);

        ctx2.drawImage(video, 0, 0);

        if (window.testRunner) {
            testRunner.notifyDone();
        }
    });
}

</script>
</head>
<body onload="onLoad();">
    Test to verify that drawing a video to a 2D canvas with drawImage and with a CanvasPattern works as expected.
    <video></video>
    <canvas id="canvas1" width="320px" height="240px"></canvas>
    <canvas id="canvas2" width="320px" height="240px"></canvas>
</body>
</html>
chromium/third_party/blink/web_tests/media/video-canvas-draw.html
