OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <style type="text/css"> | 4 <style type="text/css"> |
5 .clippingContainer { | 5 .clippingContainer { |
6 width: 200px; | 6 width: 200px; |
7 height: 200px; | 7 height: 200px; |
8 overflow: hidden; | 8 overflow: hidden; |
9 } | 9 } |
10 | 10 |
11 </style> | 11 </style> |
12 | 12 |
13 <script> | 13 <script> |
14 function drawCanvas() | 14 function drawCanvas() |
15 { | 15 { |
16 if (window.testRunner) | 16 if (window.testRunner) |
17 testRunner.dumpAsText(true); | 17 testRunner.dumpAsTextWithPixelResults(); |
18 var canvas = document.getElementById("clippedCanvas"); | 18 var canvas = document.getElementById("clippedCanvas"); |
19 var context = canvas.getContext("2d"); | 19 var context = canvas.getContext("2d"); |
20 context.fillStyle = "red"; | 20 context.fillStyle = "red"; |
21 context.fillRect(0, 0, 400, 400); | 21 context.fillRect(0, 0, 400, 400); |
22 context.fillStyle = "green"; | 22 context.fillStyle = "green"; |
23 context.fillRect(0, 0, 200, 200); | 23 context.fillRect(0, 0, 200, 200); |
24 } | 24 } |
25 </script> | 25 </script> |
26 </head> | 26 </head> |
27 | 27 |
28 <body onload="drawCanvas()"> | 28 <body onload="drawCanvas()"> |
29 <div class="clippingContainer"> | 29 <div class="clippingContainer"> |
30 <canvas id="clippedCanvas" width="400" height="400"> | 30 <canvas id="clippedCanvas" width="400" height="400"> |
31 </canvas> | 31 </canvas> |
32 </div> | 32 </div> |
33 </body> | 33 </body> |
34 | 34 |
35 </html> | 35 </html> |
OLD | NEW |