| <script> |
| |
| if (window.testRunner) { |
| window.testRunner.dumpAsText(); |
| window.testRunner.waitUntilDone(); |
| } |
| |
| function getPixel(canvas, x, y) { |
| var context = canvas.getContext("2d"); |
| var data = context.getImageData(x, y, 1, 1); |
| if (!data) |
| return [-1, -1, -1, -1]; |
| |
| var result = new Array(data.data.length) |
| for (var i = 0; i < data.data.length; i++) |
| result[i] = data.data[i]; |
| |
| return result; |
| } |
| |
| function checkArrayValues(a1, a2, tolerance) { |
| for (var i = 0, length = a1.length; i < length; i++) { |
| if (Math.abs(a1[i] - a2[i]) > tolerance) |
| return false; |
| } |
| return true; |
| } |
| |
| function pixelShouldBe(canvas, x, y, color, tolerance) { |
| var output = document.createElement("p"); |
| var value = getPixel(canvas, x, y); |
| if (checkArrayValues(color, value, tolerance)) |
| output.innerText = "PASS: Pixel (" + x + ", " + y + ") was close to " + color; |
| else |
| output.innerText = "FAIL: Pixel (" + x + ", " + y + ") was " + value + ". Expected " + color; |
| document.body.appendChild(output); |
| } |
| |
| function run() { |
| var canvas = document.createElement("canvas"); |
| document.body.appendChild(canvas); |
| canvas.width = 400; |
| canvas.height = 400; |
| var ctx = canvas.getContext("2d"); |
| var img = new Image() |
| img.addEventListener("load", function() { |
| ctx.fillStyle = "red"; |
| ctx.fillRect(0, 0, 400, 400); |
| ctx.drawImage(img, 0, 0, 400, 400); |
| pixelShouldBe(canvas, 10, 10, [255, 0, 0, 255], 5); |
| pixelShouldBe(canvas, 200, 200, [0, 255, 0, 255], 5); |
| pixelShouldBe(canvas, 390, 390, [0, 0, 255, 255], 5); |
| |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| }, false) |
| img.src = "resources/image-6400x6400.jpg"; |
| } |
| |
| window.addEventListener("load", run, false); |
| </script> |