OLD | NEW |
---|---|
1 // Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 library url_test; | 5 library url_test; |
6 import '../../pkg/unittest/lib/unittest.dart'; | 6 import '../../pkg/unittest/lib/unittest.dart'; |
7 import '../../pkg/unittest/lib/html_config.dart'; | 7 import '../../pkg/unittest/lib/html_config.dart'; |
8 import 'dart:html'; | 8 import 'dart:html'; |
9 import 'dart:math'; | |
9 | 10 |
10 // Some rounding errors in the browsers. | 11 // Some rounding errors in the browsers. |
11 checkPixel(List<int> pixel, List<int> expected) { | 12 checkPixel(List<int> pixel, List<int> expected) { |
12 expect(pixel[0], closeTo(expected[0], 2)); | 13 expect(pixel[0], closeTo(expected[0], 2)); |
13 expect(pixel[1], closeTo(expected[1], 2)); | 14 expect(pixel[1], closeTo(expected[1], 2)); |
14 expect(pixel[2], closeTo(expected[2], 2)); | 15 expect(pixel[2], closeTo(expected[2], 2)); |
15 expect(pixel[3], closeTo(expected[3], 2)); | 16 expect(pixel[3], closeTo(expected[3], 2)); |
16 } | 17 } |
17 | 18 |
18 main() { | 19 main() { |
19 useHtmlConfiguration(); | 20 useHtmlConfiguration(); |
20 var canvas = new CanvasElement(); | 21 |
21 canvas.width = 100; | 22 group('canvasRenderingContext2d', () { |
22 canvas.height = 100; | 23 var canvas; |
23 | 24 var context; |
24 var context = canvas.context2d; | 25 |
25 | 26 setUp(() { |
26 List<int> readPixel() { | 27 canvas = new CanvasElement(); |
27 var imageData = context.getImageData(2, 2, 1, 1); | 28 canvas.width = 100; |
28 return imageData.data; | 29 canvas.height = 100; |
29 } | 30 |
30 | 31 context = canvas.context2d; |
31 test('setFillColorRgb', () { | 32 }); |
32 context.setFillColorRgb(255, 0, 255, 1); | 33 |
33 context.fillRect(0, 0, canvas.width, canvas.height); | 34 tearDown(() { |
34 expect(readPixel(), [255, 0, 255, 255]); | 35 canvas = null; |
35 }); | 36 context = null; |
36 | 37 }); |
37 test('setFillColorHsl hue', () { | 38 |
38 context.setFillColorHsl(0, 100, 50); | 39 List<int> readPixel(int x, int y) { |
39 context.fillRect(0, 0, canvas.width, canvas.height); | 40 var imageData = context.getImageData(x, y, 1, 1); |
40 checkPixel(readPixel(), [255, 0, 0, 255]); | 41 return imageData.data; |
41 }); | 42 } |
42 | 43 |
43 test('setFillColorHsl hue 2', () { | 44 /// Returns true if the pixel has some data in it, false otherwise. |
44 context.setFillColorHsl(240, 100, 50); | 45 bool isPixelFilled(int x, int y) { |
45 context.fillRect(0, 0, canvas.width, canvas.height); | 46 var data = readPixel(x, y); |
blois
2013/03/08 17:48:44
how about readPixel(x, y).any((p) => p != 0)?
Andrei Mouravski
2013/03/08 18:39:12
Ooooh, you know how much I like one-liners.
| |
46 checkPixel(readPixel(), [0, 0, 255, 255]); | 47 for (int d in data) { |
47 }); | 48 if (d != 0) { |
48 | 49 return true; |
49 test('setFillColorHsl sat', () { | 50 } |
50 context.setFillColorHsl(0, 0, 50); | 51 } |
51 context.fillRect(0, 0, canvas.width, canvas.height); | 52 return false; |
52 checkPixel(readPixel(), [127, 127, 127, 255]); | 53 } |
53 }); | 54 |
54 | 55 String pixelDataToString(int x, int y) { |
55 test('setStrokeColorRgb', () { | 56 var data = readPixel(x, y); |
56 context.setStrokeColorRgb(255, 0, 255, 1); | 57 |
57 context.lineWidth = 10; | 58 return '[${data.join(", ")}]'; |
58 context.strokeRect(0, 0, canvas.width, canvas.height); | 59 } |
59 expect(readPixel(), [255, 0, 255, 255]); | 60 |
60 }); | 61 String _filled(bool v) => v ? "filled" : "unfilled"; |
61 | 62 |
62 test('setStrokeColorHsl hue', () { | 63 void expectPixelFilled(int x, int y, [bool filled = true]) { |
63 context.setStrokeColorHsl(0, 100, 50); | 64 expect(isPixelFilled(x, y), filled, reason: |
64 context.lineWidth = 10; | 65 'Pixel at ($x, $y) was expected to' |
65 context.strokeRect(0, 0, canvas.width, canvas.height); | 66 ' be: <${_filled(filled)}> but was: <${_filled(!filled)}> with data: ' |
66 expect(readPixel(), [255, 0, 0, 255]); | 67 '${pixelDataToString(x,y)}'); |
67 }); | 68 } |
68 | 69 |
69 test('setStrokeColorHsl hue 2', () { | 70 void expectPixelUnfilled(int x, int y) { |
70 context.setStrokeColorHsl(240, 100, 50); | 71 expectPixelFilled(x, y, false); |
71 context.lineWidth = 10; | 72 } |
72 context.strokeRect(0, 0, canvas.width, canvas.height); | 73 |
73 expect(readPixel(), [0, 0, 255, 255]); | 74 |
74 }); | 75 test('setFillColorRgb', () { |
75 | 76 context.setFillColorRgb(255, 0, 255, 1); |
76 test('setStrokeColorHsl sat', () { | 77 context.fillRect(0, 0, canvas.width, canvas.height); |
77 context.setStrokeColorHsl(0, 0, 50); | 78 expect(readPixel(2, 2), [255, 0, 255, 255]); |
78 context.lineWidth = 10; | 79 }); |
79 context.strokeRect(0, 0, canvas.width, canvas.height); | 80 |
80 checkPixel(readPixel(), [127, 127, 127, 255]); | 81 test('setFillColorHsl hue', () { |
81 }); | 82 context.setFillColorHsl(0, 100, 50); |
82 | 83 context.fillRect(0, 0, canvas.width, canvas.height); |
83 test('fillStyle', () { | 84 checkPixel(readPixel(2, 2), [255, 0, 0, 255]); |
84 context.fillStyle = "red"; | 85 }); |
85 context.fillRect(0, 0, canvas.width, canvas.height); | 86 |
86 checkPixel(readPixel(), [255, 0, 0, 255]); | 87 test('setFillColorHsl hue 2', () { |
87 }); | 88 context.setFillColorHsl(240, 100, 50); |
88 | 89 context.fillRect(0, 0, canvas.width, canvas.height); |
89 test('strokeStyle', () { | 90 checkPixel(readPixel(2, 2), [0, 0, 255, 255]); |
90 context.strokeStyle = "blue"; | 91 }); |
91 context.lineWidth = 10; | 92 |
92 context.strokeRect(0, 0, canvas.width, canvas.height); | 93 test('setFillColorHsl sat', () { |
93 expect(readPixel(), [0, 0, 255, 255]); | 94 context.setFillColorHsl(0, 0, 50); |
94 }); | 95 context.fillRect(0, 0, canvas.width, canvas.height); |
95 | 96 checkPixel(readPixel(2, 2), [127, 127, 127, 255]); |
96 test('fillStyle linearGradient', () { | 97 }); |
97 var gradient = context.createLinearGradient(0,0,20,20); | 98 |
98 gradient.addColorStop(0,'red'); | 99 test('setStrokeColorRgb', () { |
99 gradient.addColorStop(1,'blue'); | 100 context.setStrokeColorRgb(255, 0, 255, 1); |
100 context.fillStyle = gradient; | 101 context.lineWidth = 10; |
101 context.fillRect(0, 0, canvas.width, canvas.height); | 102 context.strokeRect(0, 0, canvas.width, canvas.height); |
102 expect(context.fillStyle is CanvasGradient, isTrue); | 103 expect(readPixel(2, 2), [255, 0, 255, 255]); |
103 }); | 104 }); |
104 | 105 |
105 test('putImageData', () { | 106 test('setStrokeColorHsl hue', () { |
106 ImageData expectedData = context.getImageData(0, 0, 10, 10); | 107 context.setStrokeColorHsl(0, 100, 50); |
107 expectedData.data[0] = 25; | 108 context.lineWidth = 10; |
108 expectedData.data[2] = 255; | 109 context.strokeRect(0, 0, canvas.width, canvas.height); |
109 context.fillStyle = 'green'; | 110 expect(readPixel(2, 2), [255, 0, 0, 255]); |
110 context.fillRect(0, 0, canvas.width, canvas.height); | 111 }); |
111 | 112 |
112 context.putImageData(expectedData, 0, 0); | 113 test('setStrokeColorHsl hue 2', () { |
113 | 114 context.setStrokeColorHsl(240, 100, 50); |
114 var resultingData = context.getImageData(0, 0, 10, 10); | 115 context.lineWidth = 10; |
115 // Make sure that we read back what we wrote. | 116 context.strokeRect(0, 0, canvas.width, canvas.height); |
116 expect(resultingData.data, expectedData.data); | 117 expect(readPixel(2, 2), [0, 0, 255, 255]); |
118 }); | |
119 | |
120 test('setStrokeColorHsl sat', () { | |
121 context.setStrokeColorHsl(0, 0, 50); | |
122 context.lineWidth = 10; | |
123 context.strokeRect(0, 0, canvas.width, canvas.height); | |
124 checkPixel(readPixel(2, 2), [127, 127, 127, 255]); | |
125 }); | |
126 | |
127 test('fillStyle', () { | |
128 context.fillStyle = "red"; | |
129 context.fillRect(0, 0, canvas.width, canvas.height); | |
130 checkPixel(readPixel(2, 2), [255, 0, 0, 255]); | |
131 }); | |
132 | |
133 test('strokeStyle', () { | |
134 context.strokeStyle = "blue"; | |
135 context.lineWidth = 10; | |
136 context.strokeRect(0, 0, canvas.width, canvas.height); | |
137 expect(readPixel(2, 2), [0, 0, 255, 255]); | |
138 }); | |
139 | |
140 test('fillStyle linearGradient', () { | |
141 var gradient = context.createLinearGradient(0,0,20,20); | |
142 gradient.addColorStop(0,'red'); | |
143 gradient.addColorStop(1,'blue'); | |
144 context.fillStyle = gradient; | |
145 context.fillRect(0, 0, canvas.width, canvas.height); | |
146 expect(context.fillStyle is CanvasGradient, isTrue); | |
147 }); | |
148 | |
149 test('putImageData', () { | |
150 ImageData expectedData = context.getImageData(0, 0, 10, 10); | |
151 expectedData.data[0] = 25; | |
152 expectedData.data[1] = 65; | |
153 expectedData.data[2] = 255; | |
154 // Set alpha to 255 to make the pixels show up. | |
155 expectedData.data[3] = 255; | |
156 context.fillStyle = 'green'; | |
157 context.fillRect(0, 0, canvas.width, canvas.height); | |
158 | |
159 context.putImageData(expectedData, 0, 0); | |
160 | |
161 var resultingData = context.getImageData(0, 0, 10, 10); | |
162 // Make sure that we read back what we wrote. | |
163 expect(resultingData.data, expectedData.data); | |
164 }); | |
165 | |
166 test('default arc should be clockwise', () { | |
167 context.beginPath(); | |
168 final r = 10; | |
169 | |
170 // Center of arc. | |
171 final cx = 20; | |
172 final cy = 20; | |
173 // Arc centered at (20, 20) with radius 10 will go clockwise | |
174 // from (20 + r, 20) to (20, 20 + r), which is 1/4 of a circle. | |
175 context.arc(cx, cy, r, 0, PI/2); | |
176 | |
177 context.strokeStyle = 'green'; | |
178 context.lineWidth = 2; | |
179 context.stroke(); | |
180 | |
181 // Center should not be filled. | |
182 expectPixelUnfilled(cx, cy); | |
183 | |
184 // (cx + r, cy) should be filled. | |
185 expectPixelFilled(cx + r, cy, true); | |
186 // (cx, cy + r) should be filled. | |
187 expectPixelFilled(cx, cy + r, true); | |
188 // (cx - r, cy) should be empty. | |
189 expectPixelFilled(cx - r, cy, false); | |
190 // (cx, cy - r) should be empty. | |
191 expectPixelFilled(cx, cy - r, false); | |
192 | |
193 // (cx + r/SQRT2, cy + r/SQRT2) should be filled. | |
194 expectPixelFilled(cx + r/SQRT2, cy + r/SQRT2, true); | |
195 | |
196 // (cx - r/SQRT2, cy - r/SQRT2) should be empty. | |
197 expectPixelFilled(cx - r/SQRT2, cy + r/SQRT2, false); | |
198 | |
199 // (cx + r/SQRT2, cy + r/SQRT2) should be empty. | |
200 expectPixelFilled(cx - r/SQRT2, cy - r/SQRT2, false); | |
201 | |
202 // (cx - r/SQRT2, cy - r/SQRT2) should be empty. | |
203 expectPixelFilled(cx + r/SQRT2, cy - r/SQRT2, false); | |
204 }); | |
205 | |
206 test('arc anticlockwise', () { | |
207 context.beginPath(); | |
208 final r = 10; | |
209 | |
210 // Center of arc. | |
211 final cx = 20; | |
212 final cy = 20; | |
213 // Arc centered at (20, 20) with radius 10 will go anticlockwise | |
214 // from (20 + r, 20) to (20, 20 + r), which is 3/4 of a circle. | |
215 // Because of the way arc work, when going anti-clockwise, the end points | |
216 // are not included, so small values are added to radius to make a little | |
217 // more than a 3/4 circle. | |
218 context.arc(cx, cy, r, .1, PI/2 - .1, true); | |
219 | |
220 context.strokeStyle = 'green'; | |
221 context.lineWidth = 2; | |
222 context.stroke(); | |
223 | |
224 // Center should not be filled. | |
225 expectPixelUnfilled(cx, cy); | |
226 | |
227 // (cx + r, cy) should be filled. | |
228 expectPixelFilled(cx + r, cy, true); | |
229 // (cx, cy + r) should be filled. | |
230 expectPixelFilled(cx, cy + r, true); | |
231 // (cx - r, cy) should be filled. | |
232 expectPixelFilled(cx - r, cy, true); | |
233 // (cx, cy - r) should be filled. | |
234 expectPixelFilled(cx, cy - r, true); | |
235 | |
236 // (cx + r/SQRT2, cy + r/SQRT2) should be empty. | |
237 expectPixelFilled(cx + r/SQRT2, cy + r/SQRT2, false); | |
238 | |
239 // (cx - r/SQRT2, cy - r/SQRT2) should be filled. | |
240 expectPixelFilled(cx - r/SQRT2, cy + r/SQRT2, true); | |
241 | |
242 // (cx + r/SQRT2, cy + r/SQRT2) should be filled. | |
243 expectPixelFilled(cx - r/SQRT2, cy - r/SQRT2, true); | |
244 | |
245 // (cx - r/SQRT2, cy - r/SQRT2) should be filled. | |
246 expectPixelFilled(cx + r/SQRT2, cy - r/SQRT2, true); | |
247 }); | |
117 }); | 248 }); |
118 } | 249 } |
OLD | NEW |