| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <style> | 2 <style> |
| 3 » canvas { | 3 canvas { |
| 4 » » display: block; | 4 width: 100px; |
| 5 » » position: fixed; | 5 height: 100px; |
| 6 » » left: 0px; | 6 image-rendering: pixelated; |
| 7 » » top: 0px; | 7 } |
| 8 » » right: 0px; | 8 </style> |
| 9 » » bottom: 0px; | 9 <body> |
| 10 » » border: none; | |
| 11 » » width: 100px; | |
| 12 » » height: 100px; | |
| 13 » » margin: 0px; | |
| 14 » » padding: 0px; | |
| 15 » » image-rendering: -webkit-optimize-contrast; | |
| 16 » } | |
| 17 </style> | |
| 18 <body> | |
| 19 <!-- The resulting image should be 100x100, consisting of 4 50x50 blocks of
solid color, with no blurring of edges --> | 10 <!-- The resulting image should be 100x100, consisting of 4 50x50 blocks of
solid color, with no blurring of edges --> |
| 20 » <canvas width="2" height="2"></canvas> | 11 <canvas width="2" height="2"></canvas> |
| 21 </body> | 12 </body> |
| 22 <script> | 13 <script> |
| 23 if (window.testRunner) | 14 var canvas; |
| 24 testRunner.dumpAsTextWithPixelResults(); | 15 var imageHandle; |
| 25 | 16 canvas = document.getElementsByTagName("canvas")[0].getContext("2d"); |
| 26 » var canvas; | 17 canvas.width = 2; |
| 27 » var imageHandle; | 18 canvas.height = 2; |
| 28 » canvas = document.getElementsByTagName("canvas")[0].getContext("2d"); | 19 imageHandle = canvas.createImageData(2, 2); |
| 29 » canvas.width = 2; | |
| 30 » canvas.height = 2; | |
| 31 » imageHandle = canvas.createImageData(2, 2); | |
| 32 | 20 |
| 33 » var index = 0; | 21 var index = 0; |
| 34 » var length = imageHandle.data.length; | 22 var length = imageHandle.data.length; |
| 35 | 23 |
| 36 imageHandle.data[index++] = 255; | 24 imageHandle.data[index++] = 255; |
| 37 imageHandle.data[index++] = 0; | 25 imageHandle.data[index++] = 0; |
| 38 imageHandle.data[index++] = 0; | 26 imageHandle.data[index++] = 0; |
| 39 imageHandle.data[index++] = 255; | 27 imageHandle.data[index++] = 255; |
| 40 | 28 |
| 41 imageHandle.data[index++] = 0; | 29 imageHandle.data[index++] = 0; |
| 42 imageHandle.data[index++] = 255; | 30 imageHandle.data[index++] = 255; |
| 43 imageHandle.data[index++] = 0; | 31 imageHandle.data[index++] = 0; |
| 44 imageHandle.data[index++] = 255; | 32 imageHandle.data[index++] = 255; |
| 45 | 33 |
| 46 imageHandle.data[index++] = 0; | 34 imageHandle.data[index++] = 0; |
| 47 imageHandle.data[index++] = 0; | 35 imageHandle.data[index++] = 0; |
| 48 imageHandle.data[index++] = 255; | 36 imageHandle.data[index++] = 255; |
| 49 imageHandle.data[index++] = 255; | 37 imageHandle.data[index++] = 255; |
| 50 | 38 |
| 51 imageHandle.data[index++] = 0; | 39 imageHandle.data[index++] = 0; |
| 52 imageHandle.data[index++] = 0; | 40 imageHandle.data[index++] = 0; |
| 53 imageHandle.data[index++] = 0; | 41 imageHandle.data[index++] = 0; |
| 54 imageHandle.data[index++] = 255; | 42 imageHandle.data[index++] = 255; |
| 55 | 43 |
| 56 » canvas.putImageData(imageHandle, 0, 0); | 44 canvas.putImageData(imageHandle, 0, 0); |
| 57 </script> | 45 </script> |
| OLD | NEW |