Source code
Revision control
Copy as Markdown
Other Tools
Test Info: Warnings
- This test has a WPT meta file that expects 16 subtest issues.
- This WPT test may be referenced by the following Test IDs:
- /html/canvas/element/manual/wide-gamut-canvas/canvas-display-p3-drawImage-ImageBitmap-canvas.html - WPT Dashboard Interop Dashboard
<!DOCTYPE HTML>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="canvas-display-p3.js"></script>
<script>
// Test that ImageBitmaps created from canvas sources with different color
// spaces can be drawn into sRGB and Display P3 canvases, by reading pixels with
// getImageData() as sRGB and Display P3 values.
function runTest(sourceColorSpace, destinationColorSpace, colors) {
for (let [sourceColorString, expectedColor] of Object.entries(colors)) {
for (let cropSource of [false, true]) {
async_test(function(t) {
let source = document.createElement("canvas");
source.width = 4;
source.height = 4;
let sourceContext = source.getContext("2d", { colorSpace: sourceColorSpace });
let sourceColor = sourceColorString.split(",").map(x => +x);
let sourceImageData = new ImageData(4, 4, { colorSpace: sourceColorSpace });
for (let i = 0; i < 4 * 4 * 4; i += 4) {
for (let c = 0; c < 4; ++c)
sourceImageData.data[i + c] = sourceColor[c];
}
sourceContext.putImageData(sourceImageData, 0, 0);
let imageBitmapPromise;
if (cropSource)
imageBitmapPromise = createImageBitmap(source, 2, 2, 2, 2);
else
imageBitmapPromise = createImageBitmap(source);
imageBitmapPromise.then(t.step_func_done(function(imageBitmap) {
let destination = document.createElement("canvas");
destination.width = 2;
destination.height = 2;
let destinationContext = destination.getContext("2d", { colorSpace: destinationColorSpace });
destinationContext.drawImage(imageBitmap, 0, 0);
let destinationImageData = destinationContext.getImageData(1, 1, 1, 1);
assert_true(pixelsApproximatelyEqual(destinationImageData.data, expectedColor), `Actual pixel value ${[...destinationImageData.data]} is approximately equal to ${expectedColor}.`);
}));
}, `Source ${sourceColorSpace}, destination ${destinationColorSpace}, color ${sourceColorString}, cropSource=${cropSource}`);
}
}
}
runTest("srgb", "display-p3", fromSRGBToDisplayP3);
runTest("display-p3", "srgb", fromDisplayP3ToSRGB);
</script>