Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(91)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/canvas/canvas-blend-image.html

Issue 2670353002: Use testharness.js instead of js-test.js in LayoutTests/fast/canvas tests. (Closed)
Patch Set: Addressing comments Created 3 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « third_party/WebKit/LayoutTests/fast/canvas/canvas-bezier-same-endpoint-expected.txt ('k') | third_party/WebKit/LayoutTests/fast/canvas/canvas-blend-image-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!doctype html> 1 <script src="../../resources/testharness.js"></script>
2 <html> 2 <script src="../../resources/testharnessreport.js"></script>
3 <head> 3 <script>
4 <script src="../../resources/js-test.js"></script> 4 var canvas = document.createElement('canvas');
5 </head> 5 canvas.width = 200;
6 <body> 6 canvas.height = 200;
7 <script src="script-tests/canvas-blend-image.js"></script> 7 ctx = canvas.getContext('2d');
8 </body> 8
9 // Create the image for blending test with images.
10 var img = document.createElement('canvas');
11 img.width = 200;
12 img.height = 200;
13 var imgCtx = img.getContext('2d');
14 imgCtx.fillStyle = "red";
15 imgCtx.fillRect(0,0,100,100);
16 imgCtx.fillStyle = "yellow";
17 imgCtx.fillRect(100,0,100,100);
18 imgCtx.fillStyle = "green";
19 imgCtx.fillRect(100,100,100,100);
20 imgCtx.fillStyle = "blue";
21 imgCtx.fillRect(0,100,100,100);
22
23 // Create expected results.
24 var blendModes =
25 // [blendMode, expectations solid on solid, expectations solid on alpha, expecta tions alpha on solid, expectations alpha on alpha]
26 [
27 ['source-over',
28 [[255, 0, 0, 255],[255, 255, 0, 255],[0, 128, 0, 255],[0, 0, 255, 255]],
29 [[128, 0, 127, 255],[128, 128, 127, 255],[0, 64, 127, 255],[0, 0, 255, 255] ],
30 [[255, 0, 0, 255],[255, 255, 0, 255],[0, 128, 0, 255],[0, 0, 255, 255]],
31 [[171, 0, 84, 191],[171, 171, 84, 191],[0, 85, 84, 191],[0, 0, 255, 191]]
32 ],
33 ['multiply',
34 [[0, 0, 0, 255],[0, 0, 0, 255],[0, 0, 0, 255],[0, 0, 255, 255]],
35 [[0, 0, 127, 255],[0, 0, 127, 255],[0, 0, 127, 255],[0, 0, 255, 255]],
36 [[128, 0, 0, 255],[128, 128, 0, 255],[0, 64, 0, 255],[0, 0, 255, 255]],
37 [[85, 0, 84, 191],[85, 85, 84, 191],[0, 43, 84, 191],[0, 0, 255, 191]]
38 ],
39 ['screen',
40 [[255, 0, 255, 255],[255, 255, 255, 255],[0, 128, 255, 255],[0, 0, 255, 255 ]],
41 [[128, 0, 255, 255],[128, 128, 255, 255],[0, 64, 255, 255],[0, 0, 255, 255] ],
42 [[255, 0, 127, 255],[255, 255, 127, 255],[0, 128, 127, 255],[0, 0, 255, 255 ]],
43 [[171, 0, 170, 191],[171, 171, 170, 191],[0, 85, 170, 191],[0, 0, 255, 191] ]
44 ],
45 ['overlay',
46 [[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255]],
47 [[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255]],
48 [[128, 0, 127, 255],[128, 128, 127, 255],[0, 64, 127, 255],[0, 0, 255, 255] ],
49 [[85, 0, 170, 191],[85, 85, 170, 191],[0, 43, 170, 191],[0, 0, 255, 191]]
50 ],
51 ['darken',
52 [[0, 0, 0, 255],[0, 0, 0, 255],[0, 0, 0, 255],[0, 0, 255, 255]],
53 [[0, 0, 127, 255],[0, 0, 127, 255],[0, 0, 127, 255],[0, 0, 255, 255]],
54 [[128, 0, 0, 255],[128, 128, 0, 255],[0, 64, 0, 255],[0, 0, 255, 255]],
55 [[85, 0, 84, 191],[85, 85, 84, 191],[0, 43, 84, 191],[0, 0, 255, 191]]
56 ],
57 ['lighten',
58 [[255, 0, 255, 255],[255, 255, 255, 255],[0, 128, 255, 255],[0, 0, 255, 255 ]],
59 [[128, 0, 255, 255],[128, 128, 255, 255],[0, 64, 255, 255],[0, 0, 255, 255] ],
60 [[255, 0, 127, 255],[255, 255, 127, 255],[0, 128, 127, 255],[0, 0, 255, 255 ]],
61 [[171, 0, 170, 191],[171, 171, 170, 191],[0, 85, 170, 191],[0, 0, 255, 191] ]
62 ],
63 ['color-dodge',
64 [[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255]],
65 [[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255]],
66 [[128, 0, 127, 255],[128, 128, 127, 255],[0, 64, 127, 255],[0, 0, 255, 255] ],
67 [[85, 0, 170, 191],[85, 85, 170, 191],[0, 43, 170, 191],[0, 0, 255, 191]]
68 ],
69 ['color-burn',
70 [[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255]],
71 [[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255]],
72 [[128, 0, 127, 255],[128, 128, 127, 255],[0, 64, 127, 255],[0, 0, 255, 255]],
73 [[85, 0, 170, 191],[85, 85, 170, 191],[0, 42, 170, 191],[0, 0, 255, 191 ]]
74 ],
75 ['hard-light',
76 [[255, 0, 0, 255],[255, 255, 0, 255],[0, 1, 0, 255],[0, 0, 255, 255]],
77 [[128, 0, 127, 255],[128, 128, 127, 255],[0, 0, 127, 255],[0, 0, 255, 255]] ,
78 [[255, 0, 0, 255],[255, 255, 0, 255],[0, 65, 0, 255],[0, 0, 255, 255]],
79 [[171, 0, 84, 191],[171, 171, 84, 191],[0, 43, 84, 191],[0, 0, 255, 191]]
80 ],
81 ['soft-light',
82 [[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255]],
83 [[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255],[0, 0, 255, 255]],
84 [[128, 0, 127, 255],[128, 128, 127, 255],[0, 64, 127, 255],[0, 0, 255, 255] ],
85 [[85, 0, 170, 191],[85, 85, 170, 191],[0, 43, 170, 191],[0, 0, 255, 191]]
86 ],
87 ['difference',
88 [[255, 0, 255, 255],[255, 255, 255, 255],[0, 128, 255, 255],[0, 0, 0, 255]] ,
89 [[128, 0, 255, 255],[128, 128, 255, 255],[0, 64, 255, 255],[0, 0, 127, 255] ],
90 [[255, 0, 127, 255],[255, 255, 127, 255],[0, 128, 127, 255],[0, 0, 128, 255 ]],
91 [[171, 0, 170, 191],[171, 171, 170, 191],[0, 85, 170, 191],[0, 0, 171, 191] ]
92 ],
93 ['exclusion',
94 [[255, 0, 255, 255],[255, 255, 255, 255],[0, 128, 255, 255],[0, 0, 0, 255]] ,
95 [[128, 0, 255, 255],[128, 128, 255, 255],[0, 64, 255, 255],[0, 0, 127, 255] ],
96 [[255, 0, 127, 255],[255, 255, 127, 255],[0, 128, 127, 255],[0, 0, 128, 255 ]],
97 [[171, 0, 170, 191],[171, 171, 170, 191],[0, 85, 170, 191],[0, 0, 171, 191] ]
98 ],
99 ['hue',
100 [[93, 0, 0, 255],[31, 31, 0, 255],[0, 46, 0, 255],[0, 0, 255, 255]],
101 [[49, 0, 127, 255],[16, 16, 127, 255],[0, 25, 127, 255],[0, 0, 255, 255]],
102 [[175, 0, 0, 255],[144, 144, 0, 255],[0, 88, 0, 255],[0, 0, 255, 255]],
103 [[116, 0, 84, 191],[96, 96, 84, 191],[0, 58, 84, 191],[0, 0, 255, 191]]
104 ],
105 ['saturation',
106 [[0, 0, 255, 255],[0, 0, 255, 255],[14, 14, 142, 255],[0, 0, 255, 255]],
107 [[0, 0, 255, 255],[0, 0, 255, 255],[7, 7, 198, 255],[0, 0, 255, 255]],
108 [[128, 0, 127, 255],[128, 128, 127, 255],[7, 71, 70, 255],[0, 0, 255, 255]] ,
109 [[85, 0, 167, 191],[85, 85, 167, 191],[4, 48, 130, 191],[0, 0, 255, 191]]
110 ],
111 ['color',
112 [[93, 0, 0, 255],[31, 31, 0, 255],[0, 47, 0, 255],[0, 0, 255, 255]],
113 [[49, 0, 127, 255],[16, 16, 127, 255],[0, 24, 127, 255],[0, 0, 255, 255]],
114 [[175, 0, 0, 255],[144, 144, 0, 255],[0, 88, 0, 255],[0, 0, 255, 255]],
115 [[116, 0, 84, 191],[96, 96, 84, 191],[0, 58, 84, 191],[0, 0, 255, 191]]
116 ],
117 ['luminosity',
118 [[55, 55, 255, 255],[224, 224, 255, 255],[54, 54, 255, 255],[0, 0, 255, 255 ]],
119 [[28, 28, 255, 255],[112, 112, 255, 255],[27, 27, 255, 255],[0, 0, 255, 255 ]],
120 [[155, 27, 127, 255],[239, 239, 127, 255],[26, 90, 127, 255],[0, 0, 255, 25 5]],
121 [[104, 19, 167, 191],[158, 158, 167, 191],[16, 58, 167, 191],[0, 0, 255, 19 1]]
122 ]];
123
124 // [Scenario, [alpha on background, alpha on foreground, index helper, index hel per]]
125 var testScenario = [
126 ['solid on solid', [1, 1, 0, 0]],
127 ['solid on alpha', [1, 0.5, 0, 1]],
128 ['alpha on solid', [0.5, 1, 0, 2]],
129 ['alpha on alpha', [0.5, 0.5, 0, 3]]
130 ];
131
132 testPoints = [{x: 50, y: 50}, {x: 150, y: 50}, {x: 150, y: 150}, {x: 50, y: 150} ];
133
134 function pixelDataAtPoint(i)
135 {
136 return ctx.getImageData(testPoints[i].x, testPoints[i].y , 1, 1).data;
137 }
138
139 function checkBlendModeResult(expectedColors, sigma) {
140 for (var i = 0; i < testPoints.length; i++) {
141 var resultColor = pixelDataAtPoint(i);
142 assert_approx_equals(resultColor[0], expectedColors[i][0], sigma);
143 assert_approx_equals(resultColor[1], expectedColors[i][1], sigma);
144 assert_approx_equals(resultColor[2], expectedColors[i][2], sigma);
145 assert_approx_equals(resultColor[3], expectedColors[i][3], sigma);
146 }
147 }
148
149 function testBlending(parameters) {
150 i = parameters[2];
151 j = parameters[3];
152 ctx.clearRect(0,0,200,200);
153 ctx.save();
154
155 // Draw backdrop.
156 ctx.fillStyle = 'rgba(0, 0, 255, ' + parameters[0] + ')';
157 ctx.fillRect(0,0,200,200);
158
159 // Apply blend mode.
160 ctx.globalCompositeOperation = blendModes[i][0];
161 ctx.globalAlpha = parameters[1];
162 ctx.drawImage(img, 0, 0);
163 checkBlendModeResult(blendModes[i][j+1], 5);
164 ctx.restore();
165 }
166
167 test(function(t) {
168 // Run test and allow variation of results.
169 // Check each blend mode individually.
170 for (var i = 0; i < blendModes.length; i++) {
171 for (var j = 0; j < testScenario.length; j++)
172 testScenario[j][1][2] = i;
Justin Novosad 2017/02/08 22:11:59 Hah, this is an original way to do it. I would ha
zakerinasab 2017/02/09 15:29:35 I tried to fix this, but it seems that testharness
173 generate_tests(testBlending, testScenario);
174 }
175 }, 'Series of tests to ensure correct results on applying different blend modes. ');
176 </script>
OLDNEW
« no previous file with comments | « third_party/WebKit/LayoutTests/fast/canvas/canvas-bezier-same-endpoint-expected.txt ('k') | third_party/WebKit/LayoutTests/fast/canvas/canvas-blend-image-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698