Index: third_party/WebKit/LayoutTests/css3/images/cross-fade-svg-size.html |
diff --git a/third_party/WebKit/LayoutTests/css3/images/cross-fade-svg-size.html b/third_party/WebKit/LayoutTests/css3/images/cross-fade-svg-size.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..c1ea96974d9838fa1830090fca94b419c0d19986 |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/css3/images/cross-fade-svg-size.html |
@@ -0,0 +1,38 @@ |
+<!DOCTYPE html> |
+<title>Test SVG in -webkit-cross-fade image</title> |
+<style> |
+div { |
+ display: inline-block; |
+ width: 100px; |
+ height: 100px; |
+} |
+#tst1 { |
+ background-image: -webkit-cross-fade( |
+ url("data:image/svg+xml,<svg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'><circle cx='5' cy='5' r='2.5' fill='green'/></svg>"), |
+ url("data:image/svg+xml,<svg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'><circle cx='5' cy='5' r='2.5' fill='red'/></svg>"), |
+ 0); |
+} |
+#tst2 { |
+ background-image: -webkit-cross-fade( |
+ url("data:image/svg+xml,<svg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'><circle cx='5' cy='5' r='2.5' fill='red'/></svg>"), |
+ url("data:image/svg+xml,<svg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'><circle cx='5' cy='5' r='2.5' fill='green'/></svg>"), |
+ 1.0); |
+} |
+#tst3 { |
+ background-image: -webkit-cross-fade( |
+ url("resources/green-10.png"), |
+ url("data:image/svg+xml,<svg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'><circle cx='5' cy='5' r='2.5' fill='green'/></svg>"), |
+ 1.0); |
+} |
+#tst4 { |
+ background-image: -webkit-cross-fade( |
+ url("data:image/svg+xml,<svg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'><circle cx='5' cy='5' r='2.5' fill='green'/></svg>"), |
+ url("resources/green-10.png"), |
+ 0.0); |
+} |
+</style> |
+<p>There should be four green circles below. |
+<div id=tst1></div> |
+<div id=tst2></div> |
+<div id=tst3></div> |
+<div id=tst4></div> |