Source code
Revision control
Copy as Markdown
Other Tools
Test Info: Warnings
- This test has a WPT meta file that disables it given conditions:
- os == "android" : https://bugzilla.mozilla.org/show_bug.cgi?id=1789949
- os == "win" : https://bugzilla.mozilla.org/show_bug.cgi?id=1847850
- This test has a WPT meta file that expects 32 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-video.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>
<body>
<script>
// Test that drawing ImageBitmaps with different video source color profiles
// into sRGB and Display P3 canvases works, by reading pixels with
// getImageData() as sRGB and Display P3 values.
for (let [filenameBase, expectedPixels] of Object.entries(videoTests)) {
for (let contextColorSpace of ["srgb", "display-p3"]) {
for (let imageDataColorSpace of ["srgb", "display-p3"]) {
for (let cropSource of [false, true]) {
promise_test(async function(t) {
let video = document.createElement("video");
for (let format of ["mp4", "webm"]) {
let source = document.createElement("source");
source.src = `resources/${filenameBase}.${format}`;
source.type = `video/${format}`;
video.append(source);
}
let loadedData = new Promise(resolver => video.onloadeddata = resolver);
document.body.append(video);
await video.play();
await loadedData;
await new Promise(requestAnimationFrame);
let imageBitmap;
if (cropSource)
imageBitmap = await createImageBitmap(video, 1, 1, 1, 1);
else
imageBitmap = await createImageBitmap(video);
video.remove();
let canvas = document.createElement("canvas");
canvas.width = 2;
canvas.height = 2;
let ctx = canvas.getContext("2d", { colorSpace: contextColorSpace });
ctx.drawImage(imageBitmap, 0, 0);
let imageData = ctx.getImageData(0, 0, 1, 1, { colorSpace: imageDataColorSpace });
let expected = expectedPixels[`${contextColorSpace} ${imageDataColorSpace}`];
assert_true(pixelsApproximatelyEqual(imageData.data, expected), `Actual pixel value ${[...imageData.data]} is approximately equal to ${expected}.`);
}, `${filenameBase}, Context ${contextColorSpace}, ImageData ${imageDataColorSpace}, cropSource=${cropSource}`);
}
}
}
}
</script>