| <!DOCTYPE html> |
| <body> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script> |
| |
| var xWidth = xHeight = 10; |
| |
| function checkImageData(canvasColorSettings, imageData) { |
| var imageDataColorSettings = imageData.getColorSettings(); |
| assert_equals(canvasColorSettings.colorSpace, imageDataColorSettings.colorSpace); |
| if (canvasColorSettings.pixelFormat == "uint8") { |
| assert_equals("uint8", imageDataColorSettings.storageFormat); |
| assert_equals(imageData.data.length, 4 * xWidth * xHeight); |
| } else { |
| assert_equals("float32", imageDataColorSettings.storageFormat); |
| assert_equals(imageData.dataUnion.length, 4 * xWidth * xHeight); |
| } |
| } |
| |
| // Test createImageData when the canvas is color managed |
| var helperImageData = new ImageData(xWidth, xHeight); |
| function runTestCreateImageData(canvasColorSettings) { |
| var aCanvas = document.createElement("canvas"); |
| aCanvas.width = xWidth; |
| aCanvas.height = xHeight; |
| var ctx = aCanvas.getContext('2d', canvasColorSettings); |
| var imageData = ctx.createImageData(xWidth, xHeight); |
| checkImageData(canvasColorSettings, imageData); |
| |
| imageData = ctx.createImageData(helperImageData); |
| checkImageData(canvasColorSettings, imageData); |
| } |
| |
| var testScenariosCreateImageData = [ |
| ["Test color managed cretateImageData: {srgb, uint8} -> {srgb, uint8}", |
| {colorSpace: "srgb", pixelFormat: "uint8"}], |
| ["Test color managed cretateImageData: {srgb, float16} -> {srgb, float32}", |
| {colorSpace: "srgb", pixelFormat: "float16"}], |
| ]; |
| |
| function runCreateImageDataTests() { |
| for (var i = 0; i < testScenariosCreateImageData.length; i++){ |
| var t = test(function() { |
| runTestCreateImageData(testScenariosCreateImageData[i][1]); |
| }, testScenariosCreateImageData[i][0]); |
| } |
| } |
| runCreateImageDataTests(); |
| |
| // Test getImageData when the canvas is color managed |
| function runTestGetImageData(canvasColorSettings) { |
| var aCanvas = document.createElement("canvas"); |
| aCanvas.width = xWidth; |
| aCanvas.height = xHeight; |
| var ctx = aCanvas.getContext('2d', canvasColorSettings); |
| var imageData = ctx.getImageData(0, 0, xWidth, xHeight); |
| checkImageData(canvasColorSettings, imageData); |
| } |
| |
| var testScenariosGetImageData = [ |
| ["Test color managed getImageData: {srgb, uint8} -> {srgb, uint8}", |
| {colorSpace: "srgb", pixelFormat: "uint8"}], |
| ["Test color managed getImageData: {srgb, float16} -> {srgb, float32}", |
| {colorSpace: "srgb", pixelFormat: "float16"}], |
| ]; |
| |
| function runGetImageDataTests() { |
| for (var i = 0; i < testScenariosGetImageData.length; i++){ |
| var t = test(function() { |
| runTestGetImageData(testScenariosGetImageData[i][1]); |
| }, testScenariosGetImageData[i][0]); |
| } |
| } |
| runGetImageDataTests(); |
| |
| // Test putImageData when the canvas is color managed. |
| |
| var dataU8 = new Uint8ClampedArray(4 * xWidth * xHeight); |
| var dataU16 = new Uint16Array(4 * xWidth * xHeight); |
| var dataF32 = new Float32Array(4 * xWidth * xHeight); |
| function prepareDataArrays() { |
| for (i = 0; i < 4 * xWidth * xHeight; i++) { |
| dataU8[i] = (i % 4 == 3) ? 255 : i % 256; |
| dataU16[i] = dataU8[i] * 257; |
| dataF32[i] = dataU8[i] / 255.0; |
| } |
| } |
| |
| var testScenariosPutImageData = []; |
| function prepareTestScenariosPutImageData() { |
| var colorSpaces = ["srgb"]; |
| var imageDataStorageFormats = ["uint8", "uint16", "float32"]; |
| var canvasPixelFormats = ["uint8", "float16"]; |
| |
| for (i = 0; i < colorSpaces.length; i++) |
| for (j = 0; j < imageDataStorageFormats.length; j++) |
| for (k = 0; k < colorSpaces.length; k++) |
| for (l = 0; l < canvasPixelFormats.length; l++) { |
| testTitle = "Test color managed putImageData: ".concat( |
| "{", colorSpaces[i], ", ", imageDataStorageFormats[j], "} -> {", colorSpaces[k], |
| ", ", canvasPixelFormats[l], "}"); |
| imageDataColorSettings = |
| {colorSpace: colorSpaces[i], storageFormat: imageDataStorageFormats[j]}; |
| canvasColorSettings = |
| {colorSpace: colorSpaces[k], pixelFormat: canvasPixelFormats[l]}; |
| testScenariosPutImageData.push([testTitle, imageDataColorSettings, canvasColorSettings]); |
| } |
| } |
| |
| function createAndPutImageData(data, imageDataColorSettings, canvasColorSettings) { |
| // create color managed canvas |
| var aCanvas = document.createElement("canvas"); |
| aCanvas.width = xWidth; |
| aCanvas.height = xHeight; |
| var ctx = aCanvas.getContext('2d', canvasColorSettings); |
| // create color managed ImageData |
| var imageData = ctx.createImageData(data, xWidth, xHeight, imageDataColorSettings); |
| // put image data into canvas. test succeeds if this does not crash. |
| ctx.putImageData(imageData, 0, 0); |
| } |
| |
| function runTestPutImageData(imageDataColorSettings, canvasColorSettings) { |
| createAndPutImageData(dataU8, imageDataColorSettings, canvasColorSettings); |
| createAndPutImageData(dataU16, imageDataColorSettings, canvasColorSettings); |
| createAndPutImageData(dataF32, imageDataColorSettings, canvasColorSettings); |
| } |
| |
| prepareDataArrays(); |
| prepareTestScenariosPutImageData(); |
| |
| function runPutImageDataTests() { |
| for (var i = 0; i < testScenariosPutImageData.length; i++){ |
| var t = test(function() { |
| runTestPutImageData(testScenariosPutImageData[i][1]); |
| }, testScenariosPutImageData[i][0]); |
| } |
| } |
| runPutImageDataTests(); |
| |
| </script> |
| </body> |
