Index: third_party/WebKit/LayoutTests/canvas/synchronous-create-pattern.html |
diff --git a/third_party/WebKit/LayoutTests/canvas/synchronous-create-pattern.html b/third_party/WebKit/LayoutTests/canvas/synchronous-create-pattern.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..e23fa3628ed8349042d265cf47707df2bf0ea104 |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/canvas/synchronous-create-pattern.html |
@@ -0,0 +1,45 @@ |
+<!DOCTYPE HTML> |
+<html> |
+<script> |
+var canvas, context, pattern, image; |
+ |
+function runTest() { |
+ if (window.testRunner) |
+ testRunner.waitUntilDone(); |
+ |
+ canvas = document.getElementById('canvas'); |
+ context = canvas.getContext('2d'); |
+ |
+ // Initialize the canvas with orange. |
+ context.fillStyle = '#FFA500'; |
+ context.fillRect(0, 0, 100, 100); |
+ |
+ image = document.getElementById('image'); |
+ image.setAttribute('src', 'resources/green-flash-at-50ms.svg'); |
+ image.onload = function() { |
+ pattern = context.createPattern(image, 'repeat'); |
+ setTimeout(function() { drawPatternAndFinish(); }, 55); |
+ } |
+} |
+ |
+function drawPatternAndFinish() { |
+ // Advance the image one more time to the last frame. |
+ // The pattern should not be affected. |
+ window.internals.advanceImageAnimation(image); |
+ |
+ context.fillStyle = pattern; |
+ context.fillRect(0, 0, 200, 200); |
+ |
+ if (window.testRunner) |
+ testRunner.notifyDone(); |
+} |
+ |
+</script> |
+<body onload='runTest()'> |
+ Test for crbug.com/279445: createPattern should synchronously snapshot an animating image.<br/> |
+ This test passes if there is a blue square below:<br/> |
+ <canvas id='canvas' width='100' height='100'></canvas><br/> |
+ And a green square below:<br/> |
+ <img id='image' width='100' height='100'> |
+</body> |
+</html> |