|
1 <!DOCTYPE HTML> |
|
2 <title>Canvas test: toBlob</title> |
|
3 <script src="/tests/SimpleTest/SimpleTest.js"></script> |
|
4 <link rel="stylesheet" href="/tests/SimpleTest/test.css"> |
|
5 <body> |
|
6 <canvas id="c" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> |
|
7 <script> |
|
8 |
|
9 function BlobListener(type, canvas, callback, file) |
|
10 { |
|
11 is(file.type, type, |
|
12 "When a valid type is specified that should be returned"); |
|
13 var reader = new FileReader(); |
|
14 reader.onload = |
|
15 function(e) { |
|
16 is(e.target.result, canvas.toDataURL(type), |
|
17 "<canvas>.mozGetAsFile().getAsDataURL() should equal <canvas>.toDataURL()"); |
|
18 callback(canvas); |
|
19 }; |
|
20 reader.readAsDataURL(file); |
|
21 } |
|
22 |
|
23 function test1(canvas) |
|
24 { |
|
25 canvas.toBlob(BlobListener.bind(undefined, "image/png", canvas, test2)); |
|
26 } |
|
27 |
|
28 function test2(canvas) |
|
29 { |
|
30 canvas.toBlob( |
|
31 BlobListener.bind(undefined, "image/jpeg", canvas, SimpleTest.finish), |
|
32 "image/jpeg"); |
|
33 } |
|
34 |
|
35 SimpleTest.waitForExplicitFinish(); |
|
36 addLoadEvent(function () { |
|
37 |
|
38 var canvas = document.getElementById('c'); |
|
39 var ctx = canvas.getContext('2d'); |
|
40 ctx.drawImage(document.getElementById('yellow75.png'), 0, 0); |
|
41 |
|
42 test1(canvas); |
|
43 |
|
44 }); |
|
45 </script> |
|
46 <img src="image_yellow75.png" id="yellow75.png" class="resource"> |
|
47 |