<!DOCTYPE html>
<!-- test case for crbug.com/597127 -->
<html>
<head>
<!-- Use a <meta> viewport, see http://crbug.com/598949 -->
<meta name="viewport" content="width=device-width, minimum-scale=1.0">
<style>
canvas {
border: 2px solid black;
margin: 5px 5px 0px 5px;
padding: 2px;
width: 150px;
height: 150px;
}
</style>
</head>
<script>
if (window.testRunner)
testRunner.waitUntilDone();
var totalTestImages = 4;
window.onload = function() {
for (var x = 0; x < totalTestImages; ++x)
loadImage(x);
};
function loadImage(x) {
var image = new Image();
var canvas = document.createElement('canvas');
canvas.width = canvas.height = 150;
document.body.appendChild(canvas);
image.onload = function() {
canvas.getContext('2d').drawImage(this, 0, 0, 150, 150);
setTimeout(canvasLoaded, 0, x + 1);
};
image.src = 'resources/ycbcr-progressive-00' + x + '.jpg';
}
function canvasLoaded(x) {
if (x >= totalTestImages && window.testRunner)
testRunner.notifyDone();
}
</script>
</html>