diff options
Diffstat (limited to 'testing/web-platform/tests/html/canvas/element/manual/wide-gamut-canvas/canvas-display-p3-drawImage-ImageBitmap-video.html')
-rw-r--r-- | testing/web-platform/tests/html/canvas/element/manual/wide-gamut-canvas/canvas-display-p3-drawImage-ImageBitmap-video.html | 57 |
1 files changed, 57 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/canvas/element/manual/wide-gamut-canvas/canvas-display-p3-drawImage-ImageBitmap-video.html b/testing/web-platform/tests/html/canvas/element/manual/wide-gamut-canvas/canvas-display-p3-drawImage-ImageBitmap-video.html new file mode 100644 index 0000000000..3e86bb5596 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/wide-gamut-canvas/canvas-display-p3-drawImage-ImageBitmap-video.html @@ -0,0 +1,57 @@ +<!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> |