Index: LayoutTests/fast/canvas/pixelated.html |
diff --git a/LayoutTests/fast/canvas/pixelated.html b/LayoutTests/fast/canvas/pixelated.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..3b895d1b1a5e2584e4c20efb4a7726d2bca4c654 |
--- /dev/null |
+++ b/LayoutTests/fast/canvas/pixelated.html |
@@ -0,0 +1,45 @@ |
+<!DOCTYPE html> |
+<style> |
+ img { |
+ display: none; |
+ } |
+ canvas { |
+ width: 100px; |
+ height: 100px; |
+ image-rendering: pixelated; |
+ } |
+ .canvas2 { |
+ image-rendering: auto; |
+ } |
+</style> |
+<body> |
+ <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFElEQVQIHWP4z8DwHwyBNJDN8B8AQNEG+t5Ik2kAAAAASUVORK5CYII="> |
+ <!-- Test that gpu accelerated canvases work with pixelated. --> |
+ <!-- The result is 3 canvases, each with a 2x2 block of colors. Only the middle canvas should be blurred. --> |
+ <canvas class="canvas0" width="4" height="4"></canvas> |
+ <canvas class="canvas1" width="4" height="4"></canvas> |
+ <canvas class="canvas2" width="4" height="4"></canvas> |
+</body> |
+<script> |
+ // Ignore the render tree. |
+ if (window.testRunner) |
+ window.testRunner.dumpAsTextWithPixelResults(); |
+ |
+ function drawToCanvas(canvas) { |
+ var ctx = canvas.getContext("2d") |
+ ctx.drawImage(document.getElementsByTagName("img")[0], 1, 1); |
+ } |
+ |
+ function draw() { |
+ drawToCanvas(document.getElementsByTagName("canvas")[0]); |
+ var canvas1 = document.getElementsByTagName("canvas")[1]; |
+ var canvas2 = document.getElementsByTagName("canvas")[2]; |
+ drawToCanvas(canvas1); |
+ drawToCanvas(canvas2); |
+ // The first canvas stays pixelated. Flip the pixelated-ness of the |
+ // other two. |
+ canvas1.style.imageRendering = "auto"; |
+ canvas2.style.imageRendering = "pixelated"; |
+ } |
+ window.onload = draw; |
+</script> |