test_toBlob.html (1203B)
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>.toBlob() 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">