Index: third_party/WebKit/LayoutTests/svg/canvas/canvas-default-object-sizing.html |
diff --git a/third_party/WebKit/LayoutTests/svg/canvas/canvas-default-object-sizing.html b/third_party/WebKit/LayoutTests/svg/canvas/canvas-default-object-sizing.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..f98c87bb8aa21c5e9e959f8c653e6ca4a658ad1c |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/svg/canvas/canvas-default-object-sizing.html |
@@ -0,0 +1,66 @@ |
+<!DOCTYPE html> |
+<title>Sizing SVG image when drawn to canvas</title> |
+<script> |
+function createCanvasWithImage(imgSrc, drawFunc) |
+{ |
+ var canvas = document.createElement('canvas'); |
+ canvas.width = 100; |
+ canvas.height = 100; |
+ var img = document.createElement('img'); |
+ img.src = imgSrc; |
+ img.onload = function() { |
+ drawFunc(canvas.getContext('2d'), img); |
+ document.documentElement.removeChild(img); |
+ } |
+ document.documentElement.appendChild(img); |
+ document.documentElement.appendChild(canvas); |
+} |
+ |
+createCanvasWithImage( |
+ 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10"><circle cx="5" cy="5" r="5" fill="blue"/></svg>', |
+ function(ctx, img) { |
+ ctx.drawImage(img, 0, 0); |
+ }); |
+ |
+createCanvasWithImage( |
+ 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 10"><circle cx="10" cy="5" r="5" fill="blue"/></svg>', |
+ function(ctx, img) { |
+ ctx.drawImage(img, 0, 0); |
+ }); |
+ |
+createCanvasWithImage( |
+ 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 20"><circle cx="5" cy="10" r="5" fill="blue"/></svg>', |
+ function(ctx, img) { |
+ ctx.drawImage(img, 0, 0); |
+ }); |
+ |
+createCanvasWithImage( |
+ 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 10"><circle cx="10" cy="5" r="5" fill="blue"/></svg>', |
+ function(ctx, img) { |
+ ctx.drawImage(img, 0, 0, 100, 100); |
+ }); |
+ |
+createCanvasWithImage( |
+ 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 20"><circle cx="5" cy="10" r="5" fill="blue"/></svg>', |
+ function(ctx, img) { |
+ ctx.drawImage(img, 0, 0, 100, 100); |
+ }); |
+ |
+createCanvasWithImage( |
+ 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="50" viewBox="0 0 10 20"><circle cx="5" cy="10" r="5" fill="blue"/></svg>', |
+ function(ctx, img) { |
+ ctx.drawImage(img, 0, 0); |
+ }); |
+ |
+createCanvasWithImage( |
+ 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="50" viewBox="0 0 20 10"><circle cx="10" cy="5" r="5" fill="blue"/></svg>', |
+ function(ctx, img) { |
+ ctx.drawImage(img, 0, 0); |
+ }); |
+ |
+createCanvasWithImage( |
+ 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="50"><circle cx="50" cy="25" r="25" fill="blue"/></svg>', |
+ function(ctx, img) { |
+ ctx.drawImage(img, 0, 0); |
+ }); |
+</script> |