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 canvas_rendering_context_2d_test; | 5 library canvas_rendering_context_2d_test; |
6 | 6 |
7 import 'dart:html'; | 7 import 'dart:html'; |
8 import 'dart:math'; | 8 import 'dart:math'; |
9 | 9 |
10 import 'package:unittest/html_individual_config.dart'; | 10 import 'package:unittest/html_individual_config.dart'; |
(...skipping 43 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
54 otherContext = null; | 54 otherContext = null; |
55 video = null; | 55 video = null; |
56 } | 56 } |
57 | 57 |
58 List<int> readPixel(int x, int y) { | 58 List<int> readPixel(int x, int y) { |
59 var imageData = context.getImageData(x, y, 1, 1); | 59 var imageData = context.getImageData(x, y, 1, 1); |
60 return imageData.data; | 60 return imageData.data; |
61 } | 61 } |
62 | 62 |
63 /// Returns true if the pixel has some data in it, false otherwise. | 63 /// Returns true if the pixel has some data in it, false otherwise. |
64 bool isPixelFilled(int x, int y) => readPixel(x,y).any((p) => p != 0); | 64 bool isPixelFilled(int x, int y) => readPixel(x, y).any((p) => p != 0); |
65 | 65 |
66 String pixelDataToString(List<int> data, int x, int y) { | 66 String pixelDataToString(List<int> data, int x, int y) { |
67 return '[${data.join(", ")}]'; | 67 return '[${data.join(", ")}]'; |
68 } | 68 } |
69 | 69 |
70 String _filled(bool v) => v ? "filled" : "unfilled"; | 70 String _filled(bool v) => v ? "filled" : "unfilled"; |
71 | 71 |
72 void expectPixelFilled(int x, int y, [bool filled = true]) { | 72 void expectPixelFilled(int x, int y, [bool filled = true]) { |
73 expect(isPixelFilled(x, y), filled, reason: | 73 expect(isPixelFilled(x, y), filled, |
74 'Pixel at ($x, $y) was expected to' | 74 reason: 'Pixel at ($x, $y) was expected to' |
75 ' be: <${_filled(filled)}> but was: <${_filled(!filled)}> with data: ' | 75 ' be: <${_filled(filled)}> but was: <${_filled(!filled)}> with data: ' |
76 '${pixelDataToString(readPixel(x, y), x, y)}'); | 76 '${pixelDataToString(readPixel(x, y), x, y)}'); |
77 } | 77 } |
78 | 78 |
79 void expectPixelUnfilled(int x, int y) { | 79 void expectPixelUnfilled(int x, int y) { |
80 expectPixelFilled(x, y, false); | 80 expectPixelFilled(x, y, false); |
81 } | 81 } |
82 | 82 |
83 main() { | 83 main() { |
84 useHtmlIndividualConfiguration(); | 84 useHtmlIndividualConfiguration(); |
85 | 85 |
86 group('pixel_manipulation', () { | 86 group('pixel_manipulation', () { |
(...skipping 59 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
146 }); | 146 }); |
147 | 147 |
148 test('strokeStyle', () { | 148 test('strokeStyle', () { |
149 context.strokeStyle = "blue"; | 149 context.strokeStyle = "blue"; |
150 context.lineWidth = 10; | 150 context.lineWidth = 10; |
151 context.strokeRect(0, 0, canvas.width, canvas.height); | 151 context.strokeRect(0, 0, canvas.width, canvas.height); |
152 expect(readPixel(2, 2), [0, 0, 255, 255]); | 152 expect(readPixel(2, 2), [0, 0, 255, 255]); |
153 }); | 153 }); |
154 | 154 |
155 test('fillStyle linearGradient', () { | 155 test('fillStyle linearGradient', () { |
156 var gradient = context.createLinearGradient(0,0,20,20); | 156 var gradient = context.createLinearGradient(0, 0, 20, 20); |
157 gradient.addColorStop(0,'red'); | 157 gradient.addColorStop(0, 'red'); |
158 gradient.addColorStop(1,'blue'); | 158 gradient.addColorStop(1, 'blue'); |
159 context.fillStyle = gradient; | 159 context.fillStyle = gradient; |
160 context.fillRect(0, 0, canvas.width, canvas.height); | 160 context.fillRect(0, 0, canvas.width, canvas.height); |
161 expect(context.fillStyle is CanvasGradient, isTrue); | 161 expect(context.fillStyle is CanvasGradient, isTrue); |
162 }); | 162 }); |
163 | 163 |
164 test('putImageData', () { | 164 test('putImageData', () { |
165 context.fillStyle = 'green'; | 165 context.fillStyle = 'green'; |
166 context.fillRect(0, 0, canvas.width, canvas.height); | 166 context.fillRect(0, 0, canvas.width, canvas.height); |
167 | 167 |
168 ImageData expectedData = context.getImageData(0, 0, 10, 10); | 168 ImageData expectedData = context.getImageData(0, 0, 10, 10); |
(...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
202 drawnData.data[7 * 4 + 3] = 255; | 202 drawnData.data[7 * 4 + 3] = 255; |
203 | 203 |
204 // Use a dirty rectangle to limit what pixels are drawn. | 204 // Use a dirty rectangle to limit what pixels are drawn. |
205 context.putImageData(drawnData, 0, 0, 1, 0, 5, 5); | 205 context.putImageData(drawnData, 0, 0, 1, 0, 5, 5); |
206 | 206 |
207 // Expect the data to be all green, as we skip all drawn pixels. | 207 // Expect the data to be all green, as we skip all drawn pixels. |
208 ImageData expectedData = context.createImageData(10, 10); | 208 ImageData expectedData = context.createImageData(10, 10); |
209 for (int i = 0; i < expectedData.data.length; i++) { | 209 for (int i = 0; i < expectedData.data.length; i++) { |
210 switch (i % 4) { | 210 switch (i % 4) { |
211 case 0: | 211 case 0: |
212 expectedData.data[i] = 0; | 212 expectedData.data[i] = 0; |
213 break; | 213 break; |
214 case 1: | 214 case 1: |
215 expectedData.data[i] = 128; | 215 expectedData.data[i] = 128; |
216 break; | 216 break; |
217 case 2: | 217 case 2: |
218 expectedData.data[i] = 0; | 218 expectedData.data[i] = 0; |
219 break; | 219 break; |
220 case 3: | 220 case 3: |
221 expectedData.data[i] = 255; | 221 expectedData.data[i] = 255; |
222 break; | 222 break; |
223 } | 223 } |
224 } | 224 } |
225 // Third pixel was copied. | 225 // Third pixel was copied. |
226 expectedData.data[2 * 4 + 0] = 25; | 226 expectedData.data[2 * 4 + 0] = 25; |
227 expectedData.data[2 * 4 + 1] = 65; | 227 expectedData.data[2 * 4 + 1] = 65; |
228 expectedData.data[2 * 4 + 2] = 255; | 228 expectedData.data[2 * 4 + 2] = 255; |
229 expectedData.data[2 * 4 + 3] = 255; | 229 expectedData.data[2 * 4 + 3] = 255; |
230 | 230 |
231 // Make sure that our data is all green. | 231 // Make sure that our data is all green. |
232 var resultingData = context.getImageData(0, 0, 10, 10); | 232 var resultingData = context.getImageData(0, 0, 10, 10); |
233 expect(resultingData.data, expectedData.data); | 233 expect(resultingData.data, expectedData.data); |
234 }); | 234 }); |
235 | 235 |
236 test('putImageData throws with wrong number of arguments', () { | 236 test('putImageData throws with wrong number of arguments', () { |
237 ImageData expectedData = context.getImageData(0, 0, 10, 10); | 237 ImageData expectedData = context.getImageData(0, 0, 10, 10); |
238 | 238 |
239 // TODO(antonm): in Dartium ArgumentError should be thrown too. | 239 // TODO(antonm): in Dartium ArgumentError should be thrown too. |
240 expect(() => context.putImageData(expectedData, 0, 0, 1), | 240 expect(() => context.putImageData(expectedData, 0, 0, 1), throws); |
241 throws); | 241 expect(() => context.putImageData(expectedData, 0, 0, 1, 1), throws); |
242 expect(() => context.putImageData(expectedData, 0, 0, 1, 1), | 242 expect(() => context.putImageData(expectedData, 0, 0, 1, 1, 5), throws); |
243 throws); | |
244 expect(() => context.putImageData(expectedData, 0, 0, 1, 1, 5), | |
245 throws); | |
246 }); | 243 }); |
247 }); | 244 }); |
248 | 245 |
249 group('arc', () { | 246 group('arc', () { |
250 setUp(setupFunc); | 247 setUp(setupFunc); |
251 tearDown(tearDownFunc); | 248 tearDown(tearDownFunc); |
252 | 249 |
253 test('default arc should be clockwise', () { | 250 test('default arc should be clockwise', () { |
254 context.beginPath(); | 251 context.beginPath(); |
255 final r = 10; | 252 final r = 10; |
256 | 253 |
257 // Center of arc. | 254 // Center of arc. |
258 final cx = 20; | 255 final cx = 20; |
259 final cy = 20; | 256 final cy = 20; |
260 // Arc centered at (20, 20) with radius 10 will go clockwise | 257 // Arc centered at (20, 20) with radius 10 will go clockwise |
261 // from (20 + r, 20) to (20, 20 + r), which is 1/4 of a circle. | 258 // from (20 + r, 20) to (20, 20 + r), which is 1/4 of a circle. |
262 context.arc(cx, cy, r, 0, PI/2); | 259 context.arc(cx, cy, r, 0, PI / 2); |
263 | 260 |
264 context.strokeStyle = 'green'; | 261 context.strokeStyle = 'green'; |
265 context.lineWidth = 2; | 262 context.lineWidth = 2; |
266 context.stroke(); | 263 context.stroke(); |
267 | 264 |
268 // Center should not be filled. | 265 // Center should not be filled. |
269 expectPixelUnfilled(cx, cy); | 266 expectPixelUnfilled(cx, cy); |
270 | 267 |
271 // (cx + r, cy) should be filled. | 268 // (cx + r, cy) should be filled. |
272 expectPixelFilled(cx + r, cy, true); | 269 expectPixelFilled(cx + r, cy, true); |
273 // (cx, cy + r) should be filled. | 270 // (cx, cy + r) should be filled. |
274 expectPixelFilled(cx, cy + r, true); | 271 expectPixelFilled(cx, cy + r, true); |
275 // (cx - r, cy) should be empty. | 272 // (cx - r, cy) should be empty. |
276 expectPixelFilled(cx - r, cy, false); | 273 expectPixelFilled(cx - r, cy, false); |
277 // (cx, cy - r) should be empty. | 274 // (cx, cy - r) should be empty. |
278 expectPixelFilled(cx, cy - r, false); | 275 expectPixelFilled(cx, cy - r, false); |
279 | 276 |
280 // (cx + r/SQRT2, cy + r/SQRT2) should be filled. | 277 // (cx + r/SQRT2, cy + r/SQRT2) should be filled. |
281 expectPixelFilled((cx + r/SQRT2).toInt(), (cy + r/SQRT2).toInt(), true); | 278 expectPixelFilled( |
| 279 (cx + r / SQRT2).toInt(), (cy + r / SQRT2).toInt(), true); |
282 | 280 |
283 // (cx - r/SQRT2, cy - r/SQRT2) should be empty. | 281 // (cx - r/SQRT2, cy - r/SQRT2) should be empty. |
284 expectPixelFilled((cx - r/SQRT2).toInt(), (cy + r/SQRT2).toInt(), false); | 282 expectPixelFilled( |
| 283 (cx - r / SQRT2).toInt(), (cy + r / SQRT2).toInt(), false); |
285 | 284 |
286 // (cx + r/SQRT2, cy + r/SQRT2) should be empty. | 285 // (cx + r/SQRT2, cy + r/SQRT2) should be empty. |
287 expectPixelFilled((cx - r/SQRT2).toInt(), (cy - r/SQRT2).toInt(), false); | 286 expectPixelFilled( |
| 287 (cx - r / SQRT2).toInt(), (cy - r / SQRT2).toInt(), false); |
288 | 288 |
289 // (cx - r/SQRT2, cy - r/SQRT2) should be empty. | 289 // (cx - r/SQRT2, cy - r/SQRT2) should be empty. |
290 expectPixelFilled((cx + r/SQRT2).toInt(), (cy - r/SQRT2).toInt(), false); | 290 expectPixelFilled( |
| 291 (cx + r / SQRT2).toInt(), (cy - r / SQRT2).toInt(), false); |
291 }); | 292 }); |
292 | 293 |
293 test('arc anticlockwise', () { | 294 test('arc anticlockwise', () { |
294 context.beginPath(); | 295 context.beginPath(); |
295 final r = 10; | 296 final r = 10; |
296 | 297 |
297 // Center of arc. | 298 // Center of arc. |
298 final cx = 20; | 299 final cx = 20; |
299 final cy = 20; | 300 final cy = 20; |
300 // Arc centered at (20, 20) with radius 10 will go anticlockwise | 301 // Arc centered at (20, 20) with radius 10 will go anticlockwise |
301 // from (20 + r, 20) to (20, 20 + r), which is 3/4 of a circle. | 302 // from (20 + r, 20) to (20, 20 + r), which is 3/4 of a circle. |
302 // Because of the way arc work, when going anti-clockwise, the end points | 303 // Because of the way arc work, when going anti-clockwise, the end points |
303 // are not included, so small values are added to radius to make a little | 304 // are not included, so small values are added to radius to make a little |
304 // more than a 3/4 circle. | 305 // more than a 3/4 circle. |
305 context.arc(cx, cy, r, .1, PI/2 - .1, true); | 306 context.arc(cx, cy, r, .1, PI / 2 - .1, true); |
306 | 307 |
307 context.strokeStyle = 'green'; | 308 context.strokeStyle = 'green'; |
308 context.lineWidth = 2; | 309 context.lineWidth = 2; |
309 context.stroke(); | 310 context.stroke(); |
310 | 311 |
311 // Center should not be filled. | 312 // Center should not be filled. |
312 expectPixelUnfilled(cx, cy); | 313 expectPixelUnfilled(cx, cy); |
313 | 314 |
314 // (cx + r, cy) should be filled. | 315 // (cx + r, cy) should be filled. |
315 expectPixelFilled(cx + r, cy, true); | 316 expectPixelFilled(cx + r, cy, true); |
316 // (cx, cy + r) should be filled. | 317 // (cx, cy + r) should be filled. |
317 expectPixelFilled(cx, cy + r, true); | 318 expectPixelFilled(cx, cy + r, true); |
318 // (cx - r, cy) should be filled. | 319 // (cx - r, cy) should be filled. |
319 expectPixelFilled(cx - r, cy, true); | 320 expectPixelFilled(cx - r, cy, true); |
320 // (cx, cy - r) should be filled. | 321 // (cx, cy - r) should be filled. |
321 expectPixelFilled(cx, cy - r, true); | 322 expectPixelFilled(cx, cy - r, true); |
322 | 323 |
323 // (cx + r/SQRT2, cy + r/SQRT2) should be empty. | 324 // (cx + r/SQRT2, cy + r/SQRT2) should be empty. |
324 expectPixelFilled((cx + r/SQRT2).toInt(), (cy + r/SQRT2).toInt(), false); | 325 expectPixelFilled( |
| 326 (cx + r / SQRT2).toInt(), (cy + r / SQRT2).toInt(), false); |
325 | 327 |
326 // (cx - r/SQRT2, cy - r/SQRT2) should be filled. | 328 // (cx - r/SQRT2, cy - r/SQRT2) should be filled. |
327 expectPixelFilled((cx - r/SQRT2).toInt(), (cy + r/SQRT2).toInt(), true); | 329 expectPixelFilled( |
| 330 (cx - r / SQRT2).toInt(), (cy + r / SQRT2).toInt(), true); |
328 | 331 |
329 // (cx + r/SQRT2, cy + r/SQRT2) should be filled. | 332 // (cx + r/SQRT2, cy + r/SQRT2) should be filled. |
330 expectPixelFilled((cx - r/SQRT2).toInt(), (cy - r/SQRT2).toInt(), true); | 333 expectPixelFilled( |
| 334 (cx - r / SQRT2).toInt(), (cy - r / SQRT2).toInt(), true); |
331 | 335 |
332 // (cx - r/SQRT2, cy - r/SQRT2) should be filled. | 336 // (cx - r/SQRT2, cy - r/SQRT2) should be filled. |
333 expectPixelFilled((cx + r/SQRT2).toInt(), (cy - r/SQRT2).toInt(), true); | 337 expectPixelFilled( |
| 338 (cx + r / SQRT2).toInt(), (cy - r / SQRT2).toInt(), true); |
334 }); | 339 }); |
335 }); | 340 }); |
336 | 341 |
337 group('drawImage_image_element', () { | 342 group('drawImage_image_element', () { |
338 setUp(setupFunc); | 343 setUp(setupFunc); |
339 tearDown(tearDownFunc); | 344 tearDown(tearDownFunc); |
340 // Draw an image to the canvas from an image element. | 345 // Draw an image to the canvas from an image element. |
341 test('with 3 params', () { | 346 test('with 3 params', () { |
342 var dataUrl = otherCanvas.toDataUrl('image/gif'); | 347 var dataUrl = otherCanvas.toDataUrl('image/gif'); |
343 var img = new ImageElement(); | 348 var img = new ImageElement(); |
(...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
386 otherContext.fillStyle = "blue"; | 391 otherContext.fillStyle = "blue"; |
387 otherContext.fillRect(5, 5, 5, 5); | 392 otherContext.fillRect(5, 5, 5, 5); |
388 var dataUrl = otherCanvas.toDataUrl('image/gif'); | 393 var dataUrl = otherCanvas.toDataUrl('image/gif'); |
389 var img = new ImageElement(); | 394 var img = new ImageElement(); |
390 | 395 |
391 img.onLoad.listen(expectAsync((_) { | 396 img.onLoad.listen(expectAsync((_) { |
392 // This will take a 6x6 square from the first canvas from position 2,2 | 397 // This will take a 6x6 square from the first canvas from position 2,2 |
393 // and then scale it to a 20x20 square and place it to the second | 398 // and then scale it to a 20x20 square and place it to the second |
394 // canvas at 50,50. | 399 // canvas at 50,50. |
395 context.drawImageToRect(img, new Rectangle(50, 50, 20, 20), | 400 context.drawImageToRect(img, new Rectangle(50, 50, 20, 20), |
396 sourceRect: new Rectangle(2, 2, 6, 6)); | 401 sourceRect: new Rectangle(2, 2, 6, 6)); |
397 | 402 |
398 checkPixel(readPixel(50, 50), [255, 0, 0, 255]); | 403 checkPixel(readPixel(50, 50), [255, 0, 0, 255]); |
399 checkPixel(readPixel(55, 55), [255, 0, 0, 255]); | 404 checkPixel(readPixel(55, 55), [255, 0, 0, 255]); |
400 checkPixel(readPixel(60, 50), [255, 0, 0, 255]); | 405 checkPixel(readPixel(60, 50), [255, 0, 0, 255]); |
401 checkPixel(readPixel(65, 65), [0, 0, 255, 255]); | 406 checkPixel(readPixel(65, 65), [0, 0, 255, 255]); |
402 checkPixel(readPixel(69, 69), [0, 0, 255, 255]); | 407 checkPixel(readPixel(69, 69), [0, 0, 255, 255]); |
403 | 408 |
404 expectPixelFilled(50, 50); | 409 expectPixelFilled(50, 50); |
405 expectPixelFilled(55, 55); | 410 expectPixelFilled(55, 55); |
406 expectPixelFilled(59, 59); | 411 expectPixelFilled(59, 59); |
(...skipping 80 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
487 expectPixelFilled(57, 57); | 492 expectPixelFilled(57, 57); |
488 expectPixelUnfilled(58, 58); | 493 expectPixelUnfilled(58, 58); |
489 expectPixelUnfilled(0, 0); | 494 expectPixelUnfilled(0, 0); |
490 expectPixelUnfilled(70, 70); | 495 expectPixelUnfilled(70, 70); |
491 })); | 496 })); |
492 | 497 |
493 video.onError.listen((_) { | 498 video.onError.listen((_) { |
494 fail('URL failed to load.'); | 499 fail('URL failed to load.'); |
495 }); | 500 }); |
496 | 501 |
497 if(video.canPlayType('video/webm; codecs="vp8.0, vorbis"', '') != '') { | 502 if (video.canPlayType('video/webm; codecs="vp8.0, vorbis"', '') != '') { |
498 video.src = webmVideoUrl; | 503 video.src = webmVideoUrl; |
499 } else if(video.canPlayType('video/mp4; codecs="avc1.4D401E, mp4a.40.2"', | 504 } else if (video.canPlayType( |
500 null) != '') { | 505 'video/mp4; codecs="avc1.4D401E, mp4a.40.2"', null) != |
| 506 '') { |
501 video.src = mp4VideoUrl; | 507 video.src = mp4VideoUrl; |
502 } else { | 508 } else { |
503 window.console.log('Video is not supported on this system.'); | 509 window.console.log('Video is not supported on this system.'); |
504 } | 510 } |
505 }); | 511 }); |
506 | 512 |
507 test('with 5 params', () { | 513 test('with 5 params', () { |
508 video.onCanPlay.listen(expectAsync((_) { | 514 video.onCanPlay.listen(expectAsync((_) { |
509 context.drawImageToRect(video, new Rectangle(50, 50, 20, 20)); | 515 context.drawImageToRect(video, new Rectangle(50, 50, 20, 20)); |
510 | 516 |
511 expectPixelFilled(50, 50); | 517 expectPixelFilled(50, 50); |
512 expectPixelFilled(55, 55); | 518 expectPixelFilled(55, 55); |
513 expectPixelFilled(59, 59); | 519 expectPixelFilled(59, 59); |
514 expectPixelFilled(60, 60); | 520 expectPixelFilled(60, 60); |
515 expectPixelFilled(69, 69); | 521 expectPixelFilled(69, 69); |
516 expectPixelUnfilled(70, 70); | 522 expectPixelUnfilled(70, 70); |
517 expectPixelUnfilled(0, 0); | 523 expectPixelUnfilled(0, 0); |
518 expectPixelUnfilled(80, 80); | 524 expectPixelUnfilled(80, 80); |
519 })); | 525 })); |
520 video.onError.listen((_) { | 526 video.onError.listen((_) { |
521 fail('URL failed to load.'); | 527 fail('URL failed to load.'); |
522 }); | 528 }); |
523 | 529 |
524 if(video.canPlayType('video/webm; codecs="vp8.0, vorbis"', '') != '') { | 530 if (video.canPlayType('video/webm; codecs="vp8.0, vorbis"', '') != '') { |
525 video.src = webmVideoUrl; | 531 video.src = webmVideoUrl; |
526 } else if(video.canPlayType('video/mp4; codecs="avc1.4D401E, mp4a.40.2"', | 532 } else if (video.canPlayType( |
527 null) != '') { | 533 'video/mp4; codecs="avc1.4D401E, mp4a.40.2"', null) != |
| 534 '') { |
528 video.src = mp4VideoUrl; | 535 video.src = mp4VideoUrl; |
529 } else { | 536 } else { |
530 // TODO(amouravski): Better fallback? | 537 // TODO(amouravski): Better fallback? |
531 window.console.log('Video is not supported on this system.'); | 538 window.console.log('Video is not supported on this system.'); |
532 } | 539 } |
533 }); | 540 }); |
534 | 541 |
535 test('with 9 params', () { | 542 test('with 9 params', () { |
536 video.onCanPlay.listen(expectAsync((_) { | 543 video.onCanPlay.listen(expectAsync((_) { |
537 context.drawImageToRect(video, new Rectangle(50, 50, 20, 20), | 544 context.drawImageToRect(video, new Rectangle(50, 50, 20, 20), |
538 sourceRect: new Rectangle(2, 2, 6, 6)); | 545 sourceRect: new Rectangle(2, 2, 6, 6)); |
539 | 546 |
540 expectPixelFilled(50, 50); | 547 expectPixelFilled(50, 50); |
541 expectPixelFilled(55, 55); | 548 expectPixelFilled(55, 55); |
542 expectPixelFilled(59, 59); | 549 expectPixelFilled(59, 59); |
543 expectPixelFilled(60, 60); | 550 expectPixelFilled(60, 60); |
544 expectPixelFilled(69, 69); | 551 expectPixelFilled(69, 69); |
545 expectPixelUnfilled(70, 70); | 552 expectPixelUnfilled(70, 70); |
546 expectPixelUnfilled(0, 0); | 553 expectPixelUnfilled(0, 0); |
547 expectPixelUnfilled(80, 80); | 554 expectPixelUnfilled(80, 80); |
548 })); | 555 })); |
549 video.onError.listen((_) { | 556 video.onError.listen((_) { |
550 fail('URL failed to load.'); | 557 fail('URL failed to load.'); |
551 }); | 558 }); |
552 | 559 |
553 if(video.canPlayType('video/webm; codecs="vp8.0, vorbis"', '') != '') { | 560 if (video.canPlayType('video/webm; codecs="vp8.0, vorbis"', '') != '') { |
554 video.src = webmVideoUrl; | 561 video.src = webmVideoUrl; |
555 } else if(video.canPlayType('video/mp4; codecs="avc1.4D401E, mp4a.40.2"', | 562 } else if (video.canPlayType( |
556 null) != '') { | 563 'video/mp4; codecs="avc1.4D401E, mp4a.40.2"', null) != |
| 564 '') { |
557 video.src = mp4VideoUrl; | 565 video.src = mp4VideoUrl; |
558 } else { | 566 } else { |
559 // TODO(amouravski): Better fallback? | 567 // TODO(amouravski): Better fallback? |
560 window.console.log('Video is not supported on this system.'); | 568 window.console.log('Video is not supported on this system.'); |
561 } | 569 } |
562 }); | 570 }); |
563 }); | 571 }); |
564 | 572 |
565 group('drawImage_video_element_dataUrl', () { | 573 group('drawImage_video_element_dataUrl', () { |
566 setUp(setupFunc); | 574 setUp(setupFunc); |
567 tearDown(tearDownFunc); | 575 tearDown(tearDownFunc); |
568 | 576 |
569 test('with 9 params', () { | 577 test('with 9 params', () { |
570 video = new VideoElement(); | 578 video = new VideoElement(); |
571 canvas = new CanvasElement(); | 579 canvas = new CanvasElement(); |
572 video.onCanPlay.listen(expectAsync((_) { | 580 video.onCanPlay.listen(expectAsync((_) { |
573 context.drawImageToRect(video, new Rectangle(50, 50, 20, 20), | 581 context.drawImageToRect(video, new Rectangle(50, 50, 20, 20), |
574 sourceRect: new Rectangle(2, 2, 6, 6)); | 582 sourceRect: new Rectangle(2, 2, 6, 6)); |
575 | 583 |
576 expectPixelFilled(50, 50); | 584 expectPixelFilled(50, 50); |
577 expectPixelFilled(55, 55); | 585 expectPixelFilled(55, 55); |
578 expectPixelFilled(59, 59); | 586 expectPixelFilled(59, 59); |
579 expectPixelFilled(60, 60); | 587 expectPixelFilled(60, 60); |
580 expectPixelFilled(69, 69); | 588 expectPixelFilled(69, 69); |
581 expectPixelUnfilled(70, 70); | 589 expectPixelUnfilled(70, 70); |
582 expectPixelUnfilled(0, 0); | 590 expectPixelUnfilled(0, 0); |
583 expectPixelUnfilled(80, 80); | 591 expectPixelUnfilled(80, 80); |
584 })); | 592 })); |
585 video.onError.listen((_) { | 593 video.onError.listen((_) { |
586 fail('URL failed to load.'); | 594 fail('URL failed to load.'); |
587 }); | 595 }); |
588 | 596 |
589 if(video.canPlayType('video/webm; codecs="vp8.0, vorbis"', '') != '') { | 597 if (video.canPlayType('video/webm; codecs="vp8.0, vorbis"', '') != '') { |
590 video.src = webmVideoDataUrl; | 598 video.src = webmVideoDataUrl; |
591 } else if(video.canPlayType('video/mp4; codecs="avc1.4D401E, mp4a.40.2"', | 599 } else if (video.canPlayType( |
592 null) != '') { | 600 'video/mp4; codecs="avc1.4D401E, mp4a.40.2"', null) != |
| 601 '') { |
593 video.src = mp4VideoDataUrl; | 602 video.src = mp4VideoDataUrl; |
594 } else { | 603 } else { |
595 // TODO(amouravski): Better fallback? | 604 // TODO(amouravski): Better fallback? |
596 window.console.log('Video is not supported on this system.'); | 605 window.console.log('Video is not supported on this system.'); |
597 } | 606 } |
598 }); | 607 }); |
599 }); | 608 }); |
600 | 609 |
601 group('drawImage_canvas_element', () { | 610 group('drawImage_canvas_element', () { |
602 setUp(setupFunc); | 611 setUp(setupFunc); |
(...skipping 128 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
731 | 740 |
732 // The box does not draw after 20 pixels. | 741 // The box does not draw after 20 pixels. |
733 expectPixelUnfilled(x - 10, y); | 742 expectPixelUnfilled(x - 10, y); |
734 expectPixelUnfilled(x + maxWidth + 1, y); | 743 expectPixelUnfilled(x + maxWidth + 1, y); |
735 expectPixelUnfilled(x + maxWidth + 20, y); | 744 expectPixelUnfilled(x + maxWidth + 20, y); |
736 expectPixelFilled(x, y); | 745 expectPixelFilled(x, y); |
737 expectPixelFilled(x + 10, y); | 746 expectPixelFilled(x + 10, y); |
738 }); | 747 }); |
739 }); | 748 }); |
740 } | 749 } |
OLD | NEW |