<!DOCTYPE html>
<canvas id="canvas" width="1" height="1"></canvas>
<script src="../../resources/js-test.js"></script>
<script>
jsTestIsAsync = true;

description("Tests that non-opaque pixels are faithfully preserved in conversions between ImageData and ImageBitmap");

var imageData = new ImageData(new Uint8ClampedArray([12, 34, 56, 64]), 1, 1);
var newImageData;
createImageBitmap(imageData).then(imageBitmap => {
    var context = document.getElementById("canvas").getContext("2d");
    context.drawImage(imageBitmap, 0, 0);
    newImageData = context.getImageData(0, 0, 1, 1);

    // newImageData is not necessary the same as imageData because of
    // multiplying and dividing by alpha during the round trip, but
    // they should be close.
    // The alpha channel should be exactly the same.
    shouldBeCloseTo("newImageData.data[0]", "imageData.data[0]", 5);
    shouldBeCloseTo("newImageData.data[1]", "imageData.data[1]", 5);
    shouldBeCloseTo("newImageData.data[2]", "imageData.data[2]", 5);
    shouldBe("newImageData.data[3]", "imageData.data[3]");

    finishJSTest();
});
</script>