<html>
<meta name=fuzzy content="maxDifference=0-1;totalPixels=0-1">
<body>
<canvas id="c1" width="250" height="250"></canvas>
<canvas id="c2" width="250" height="250"></canvas>
<br>
<canvas id="c3" width="250" height="250"></canvas>
<canvas id="c4" width="250" height="250"></canvas>
<script type="text/javascript">
if (window.testRunner)
testRunner.waitUntilDone();
function shouldNotBeCalled() {
testFailed("Promise was rejected.");
finishJSTest();
}
var canvas1 = document.getElementById('c1');
var canvas2 = document.getElementById('c2');
var canvas3 = document.getElementById('c3');
var canvas4 = document.getElementById('c4');
var bgcanvas = document.createElement('canvas');
bgcanvas.width = 100;
bgcanvas.height = 100;
var bgctx = bgcanvas.getContext('2d');
bgctx.fillStyle = 'green';
bgctx.fillRect(0, 0, bgcanvas.width, bgcanvas.height);
var greenSquareURL = bgcanvas.toDataURL();
var img = new Image();
img.onload = imageLoaded;
img.src = greenSquareURL;
var ctx1 = canvas1.getContext('2d');
var ctx2 = canvas2.getContext('2d');
var ctx3 = canvas3.getContext('2d');
var ctx4 = canvas4.getContext('2d');
function imageLoaded() {
createImageBitmap(img).then(imageBitmapCallback(ctx1), shouldNotBeCalled);
createImageBitmap(img, -50, -50, 100, 100).then(imageBitmapCallback(ctx2), shouldNotBeCalled);
createImageBitmap(img, 50, 50, 100, 100).then(imageBitmapCallback(ctx3), shouldNotBeCalled);
createImageBitmap(img, -100, -100, 300, 300).then(imageBitmapCallback(ctx4), shouldNotBeCalled);
}
var pending = 0;
function imageBitmapCallback(ctx) {
pending++;
var ctx = ctx;
return function(imageBitmap) {
pending--;
ctx.drawImage(imageBitmap, -100, -100, 300, 300, -25, -25, 300, 300);
ctx.drawImage(imageBitmap, -100, -100, 200, 200, -25, -25, 100, 100);
ctx.drawImage(imageBitmap, 0, -100, 100, 200, 75, -25, 100, 100);
ctx.drawImage(imageBitmap, 0, -100, 200, 200, 175, -25, 100, 100);
ctx.drawImage(imageBitmap, -100, 0, 200, 100, -25, 75, 100, 100);
ctx.drawImage(imageBitmap, 0, 0, 200, 100, 175, 75, 100, 100);
ctx.drawImage(imageBitmap, -100, 0, 200, 200, -25, 175, 100, 100);
ctx.drawImage(imageBitmap, 0, 0, 100, 200, 75, 175, 100, 100);
ctx.drawImage(imageBitmap, 0, 0, 200, 200, 175, 175, 100, 100);
if (!pending && window.testRunner)
testRunner.notifyDone();
}
}
</script>
</body></html>