| <!DOCTYPE HTML> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <script> |
| |
| // Reference values generated by: |
| // https://fiddle.skia.org/c/8e7238b69744678e75b3e34715b29e0b |
| |
| // sRGB(155,27,27,255) |
| var rec2020OpaqueRed = [0.52148, 0.23914, 0.18030, 1.0]; |
| // sRGB(27,155,27,255) |
| var rec2020OpaqueGreen = [0.40771, 0.60742, 0.25879, 1.0]; |
| // sRGB(27,27,155,255) |
| var rec2020OpaqueBlue = [0.21558, 0.17249, 0.59961, 1.0]; |
| // sRGB(27,27,27,255) |
| var rec2020OpaqueBlack = [0.15283, 0.15283, 0.15283, 1.0]; |
| |
| function testPixels(ctx, tests, colorSetting) |
| { |
| var actual, expected, tolerance = 0.01; |
| for (var i = 0; i < tests.length; i++) { |
| actual = ctx.getImageData(tests[i].x, tests[i].y, 1, 1, colorSetting).data; |
| expected = tests[i].color; |
| assert_true(actual.length === expected.length); |
| for (var j = 0; j < actual.length; j++) |
| assert_approx_equals(actual[j], expected[j], tolerance); |
| } |
| } |
| |
| function drawSRGBImageOnRec2020Canvas(source) |
| { |
| var canvas = document.createElement('canvas'); |
| canvas.width = 20; |
| canvas.height = 20; |
| var ctx = canvas.getContext('2d', |
| {colorSpace: 'rec2020', pixelFormat:'float16'}); |
| ctx.drawImage(source, 0, 0); |
| var tests = [{x: 5, y: 5, color: rec2020OpaqueRed}, |
| {x: 15, y: 5, color: rec2020OpaqueGreen}, |
| {x: 5, y: 15, color: rec2020OpaqueBlue}, |
| {x: 15, y: 15, color: rec2020OpaqueBlack}]; |
| testPixels(ctx, tests, {colorSpace: 'rec2020', storageFormat: 'float32'}); |
| } |
| |
| promise_test(function() { |
| return new Promise((resolve, reject) => { |
| var image = new Image(); |
| image.onload = function() { |
| resolve(image); |
| } |
| image.src = 'resources/pattern-srgb.png' |
| }).then(drawSRGBImageOnRec2020Canvas); |
| }, 'Draw SRGB image on a Rec2020 canvas and read back the Rec2020 pixels.'); |
| |
| </script> |
| |