third_party/WebKit/LayoutTests/fast/canvas/DrawImageSinglePixelStretch.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3
   4   <head>
   5     <title>Odd stretching of pixel-wide drawImage call</title>
   6     <script type="text/javascript" charset="utf-8">
   7         window.addEventListener('DOMContentLoaded', init, true);
   8
   9         var image, ctx;
  10
  11         function init () {
  12           if (window.testRunner) {
  13             testRunner.dumpAsText();
  14             testRunner.waitUntilDone();
  15           }
  16
  17           var canvas = document.getElementById("c");
  18           canvas.width = 200;
  19           canvas.height = 50;
  20           ctx = canvas.getContext('2d');
  21
  22           image = new Image();
  23           image.addEventListener('load', draw, false);
  24           image.src = 'resources/orangePixels.gif';
  25         };
  26
  27         function draw () {
  28           var w = ctx.canvas.width;
  29           var h = ctx.canvas.height;
  30           // part between left corner and arrow
  31           ctx.drawImage(image, 3, 2, 1, 1,
  32                                0, 0, w, h);
  33           setTimeout(checkPixels, 0);
  34         };
  35
  36         function checkPixels() {
  37             var passed = areAllRowsUniform(ctx);
  38
  39             var result = document.getElementById('result');
  40             if (passed)
  41                 result.innerHTML = "PASSED";
  42             else
  43                 result.innerHTML = "FAILED";
  44
  45             if (window.testRunner)
  46                 testRunner.notifyDone();
  47         }
  48
  49         function areAllRowsUniform(ctx) {
  50             for (var y = 0; y < ctx.canvas.height; y++) {
  51                 if (!isRowUniform(ctx,y))
  52                     return false;
  53             }
  54
  55             return true;
  56         }
  57
  58         function isRowUniform(ctx, y) {
  59             var start = getPixel(ctx, 0, y);
  60
  61             for (var i = 0; i < ctx.canvas.width; i++) {
  62                 if (!areEqual(start, getPixel(ctx, i, y)))
  63                     return false;
  64             }
  65
  66             return true;
  67         };
  68
  69         function areEqual(a, b) {
  70             return a[0] == b[0] && a[1] == b[1] && a[2] == b[2] && a[3] == b[3];
  71         };
  72
  73         function getPixel(ctx, x, y) {
  74             var idata = ctx.getImageData(x,y,1,1);
  75             return idata.data;
  76         };
  77     </script>
  78
  79   </head>
  80
  81   <body>
  82   <p>DrawImage with a source of a single pixel should draw one uniform color throughout. Neighboring pixels in the source image shouldn't affect the destination rect's output pixels</p>
  83   <p>(Bugzilla: https://bugs.webkit.org/show_bug.cgi?id=58267) (Radar: rdar://problem/9148473)</p>
  84
  85   <p> This canvas should be uniformly one color </p>
  86   <p id="result"></p>
  87   <canvas id="c"</canvas>
  88   </body>
  89 </html>