| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/st
rict.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 thr
oughout. 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://pr
oblem/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> | |
| OLD | NEW |