canvas-display-p3-drawImage-ImageBitmap-image.html (2134B)
1 <!DOCTYPE HTML> 2 <script src="/resources/testharness.js"></script> 3 <script src="/resources/testharnessreport.js"></script> 4 <script src="canvas-display-p3.js"></script> 5 <script> 6 // Test that drawing ImageBitmaps with different image source bit depths and 7 // color profiles into sRGB and Display P3 canvases works, by reading pixels 8 // with getImageData() as sRGB and Display P3 values. 9 for (let [filename, expectedPixels] of Object.entries(imageTests)) { 10 for (let contextColorSpace of ["srgb", "display-p3"]) { 11 for (let imageDataColorSpace of ["srgb", "display-p3"]) { 12 for (let cropSource of [false, true]) { 13 async_test(function(t) { 14 let image = new Image(); 15 image.onload = t.step_func(function() { 16 17 let canvas = document.createElement("canvas"); 18 canvas.width = 2; 19 canvas.height = 2; 20 21 let ctx = canvas.getContext("2d", { colorSpace: contextColorSpace }); 22 23 let imageBitmapPromise; 24 if (cropSource) 25 imageBitmapPromise = createImageBitmap(image, 1, 1, 1, 1); 26 else 27 imageBitmapPromise = createImageBitmap(image); 28 29 imageBitmapPromise.then(t.step_func_done(function(imageBitmap) { 30 ctx.drawImage(imageBitmap, 0, 0); 31 32 let imageData = ctx.getImageData(0, 0, 1, 1, { colorSpace: imageDataColorSpace }); 33 34 let expected = expectedPixels[`${contextColorSpace} ${imageDataColorSpace}`]; 35 assert_true(pixelsApproximatelyEqual(imageData.data, expected), `Actual pixel value ${[...imageData.data]} is approximately equal to ${expected}.`); 36 })); 37 }); 38 image.src = `resources/${filename}`; 39 }, `${filename}, Context ${contextColorSpace}, ImageData ${imageDataColorSpace}, cropSource=${cropSource}`); 40 } 41 } 42 } 43 } 44 </script>