<!DOCTYPE HTML>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>
function shouldBeGreen(x, y) {
d = ctx.getImageData(x, y, 1, 1).data;
assert_array_equals(d, [0, 128, 0, 255]);
}
function shouldBeTransparent(x, y) {
d = ctx.getImageData(x, y, 1, 1).data;
assert_array_equals(d, [0, 0, 0, 0]);
}
function checkBitmap(imageBitmap, width, height)
{
bitmap = imageBitmap;
assert_equals(bitmap.width, width);
assert_equals(bitmap.height, height);
var half_width = width / 2;
var half_height = height / 2;
ctx.clearRect(0, 0, 200, 200);
ctx.drawImage(bitmap, 0, 0);
shouldBeGreen(0, 0);
shouldBeGreen(0, half_height - 1);
shouldBeGreen(half_width - 1, 0);
shouldBeGreen(half_width - 1, half_height - 1);
shouldBeTransparent(0, height - 1);
shouldBeTransparent(width - 1, 0);
shouldBeTransparent(width - 1, height - 1);
}
function checkFlippedBitmap(imageBitmap, width, height)
{
bitmap = imageBitmap;
assert_equals(bitmap.width, width);
assert_equals(bitmap.height, height);
var half_width = width / 2;
var half_height = height / 2;
ctx.clearRect(0, 0, 200, 200);
ctx.drawImage(bitmap, 0, 0);
shouldBeTransparent(0, 0);
shouldBeTransparent(0, half_height - 1);
shouldBeTransparent(half_width - 1, 0);
shouldBeTransparent(half_width - 1, half_height - 1);
shouldBeGreen(0, half_height);
shouldBeGreen(half_width - 1, half_height);
shouldBeGreen(0, height - 1);
shouldBeGreen(half_width - 1, height - 1);
}
function generateTests() {
imageBitmaps = {};
var p1 = createImageBitmap(image).then(function(image) { imageBitmaps.noResize = image });
var p2 = createImageBitmap(image, {resizeWidth: 50, resizeHeight: 50, resizeQuality: "high"}).then(function(image) { imageBitmaps.resizeDown = image });
var p3 = createImageBitmap(image, 50, 50, 100, 100).then(function(image) { imageBitmaps.cropCenter = image });
var p4 = createImageBitmap(image, 50, 50, 100, 100, {resizeWidth: 200, resizeHeight: 200, resizeQuality: "high"}).then(function(image) { imageBitmaps.cropResizeUp = image });
var p5 = createImageBitmap(image, 50, 50, 100, 100, {resizeWidth: 50, resizeHeight: 50, resizeQuality: "high"}).then(function(image) { imageBitmaps.cropResizeDown = image });
var p6 = createImageBitmap(image, {imageOrientation: "flipY"}).then(function(image) { imageBitmaps.noResizeFlip = image });
var p7 = createImageBitmap(image, 50, 50, 100, 100, {imageOrientation: "flipY"}).then(function(image) { imageBitmaps.cropCenterFlip = image });
var p8 = createImageBitmap(image, {resizeWidth: 100, resizeHeight: 100, resizeQuality: "high", imageOrientation: "flipY"}).then(function(image) { imageBitmaps.resizeFlip = image });
var p9 = createImageBitmap(image, 50, 50, 100, 100, {resizeWidth: 200, resizeHeight: 200, resizeQuality: "high", imageOrientation: "flipY"}).then(function(image) { imageBitmaps.cropResizeFlip = image });
return Promise.all([p1, p2, p3, p4, p5, p6, p7, p8, p9]).then(t.step_func_done(function() {
checkBitmap(imageBitmaps.noResize, 200, 200);
checkBitmap(imageBitmaps.resizeDown, 50, 50);
checkBitmap(imageBitmaps.cropCenter, 100, 100);
checkBitmap(imageBitmaps.cropResizeUp, 200, 200);
checkBitmap(imageBitmaps.cropResizeDown, 50, 50);
checkFlippedBitmap(imageBitmaps.noResizeFlip, 200, 200);
checkFlippedBitmap(imageBitmaps.cropCenterFlip, 100, 100);
checkFlippedBitmap(imageBitmaps.resizeFlip, 100, 100);
checkFlippedBitmap(imageBitmaps.cropResizeFlip, 200, 200);
}), t.step_func_done(function() {
assert_true(false, 'Promise rejected');
}));
}
var t = async_test('createImageBitmap from svg');
var canvas = document.createElement("canvas");
canvas.setAttribute("width", "200");
canvas.setAttribute("height", "200");
var ctx = canvas.getContext("2d");
var image = new Image();
image.onload = t.step_func(function() {
return generateTests();
});
image.src = '../../svg/as-image/resources/100px-green-rect.svg';
</script>