Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(95)

Unified Diff: third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto.html

Issue 2230963002: SVG Image intrinsic size should be used if css style size is 'auto' (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: rename file Created 4 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto.html
diff --git a/third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto.html b/third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto.html
new file mode 100644
index 0000000000000000000000000000000000000000..cee0ee42b5274768e3167c8785b08a18a52c63d4
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto.html
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<title>Test <svg:image>'s sizing </title>
fs 2016/08/19 08:59:45 Drop "Test" and add 'auto', so maybe: <svg:image>
Shanmuga Pandi 2016/09/14 09:20:16 Done.
+<script src="../../resources/testharness.js"></script>
+<script src="../../resources/testharnessreport.js"></script>
+<svg height="0">
+ <image width="100" height="100" xlink:href="resources/square-green-checker.png" />
+ <image width="100" height="100" xlink:href="resources/square-green-checker.png" style="width:auto"/>
+ <image width="100" height="100" xlink:href="resources/square-green-checker.png" style="height:auto"/>
+ <image width="100" height="100" xlink:href="resources/square-green-checker.png" style="width:auto; height:auto"/>
+ <image width="200" height="200"
+ xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>"/>
+ <image width="200" height="200"
+ xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'></svg>" style='width:auto; height:auto'/>
+ <image width="200" height="200"
+ xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'></svg>" style='width:auto;'/>
+ <image xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'></svg>" style='width:auto;'/>
+ <image height="200"
+ xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'></svg>" style='width:auto;'/>
+ <image width="200"
+ xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'></svg>" style='height:auto;'/>
+ <image width="200" height="200"
+ xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>" style='width:auto; height:auto'/>
+ <image height="200"
+ xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>" style='width:auto; height:auto'/>
+ <image width="200"
+ xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>" style='width:auto; height:auto'/>
+ <image xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>"/>
fs 2016/08/19 08:59:45 Still missing tests with no intrinsic dimensions b
Shanmuga Pandi 2016/08/19 11:56:42 Could you please give one sample for that(no intri
fs 2016/08/19 12:01:31 <svg viewBox="0 0 400 200"></svg>
Shanmuga Pandi 2016/09/14 09:20:16 I have added more variation.
+</svg>
+<script>
+Dimension = function(w,h,desc) {
+ this.width = w;
+ this.height = h;
+ this.desc = desc;
+};
+Dimension.prototype.toString = function() {
+ return this.width + "," + this.height;
+};
+// The order of expected sizes should equal the document order of the images.
+var expectedBoxes = [
+ new Dimension(100, 100, "400x400 png image, with intrinsic width='100' height='100'"),
fs 2016/08/19 08:59:45 You could probably drop the class, and just do: {
Shanmuga Pandi 2016/09/14 09:20:16 Done.
+ new Dimension(400, 100, "400x400 png image, with intrinsic width='100' height='100', and with CSS 'width:auto'"),
+ new Dimension(100, 400, "400x400 png image, with intrinsic width='100' height='100', and with CSS 'height:auto'"),
+ new Dimension(400, 400, "400x400 png image, with intrinsic width='100' height='100', and with CSS 'width:auto; height:auto'"),
+ new Dimension(200, 200, "default sized svg image, with intrinsic width='200' height='200'"),
+ new Dimension(100, 100, "100x100 svg image, with intrinsic width='200' height='200', and with CSS 'width:auto; height:auto'"),
+ new Dimension(100, 200, "100x100 svg image, with intrinsic width='200' height='200', and with CSS 'width:auto'"),
+ new Dimension(100, 100, "100x100 svg image, without intrinsic width and height, and with CSS 'width:auto'"),
+ new Dimension(100, 200, "100x100 svg image, with intrinsic height='200', and with 'width:auto'"),
+ new Dimension(200, 100, "100x100 svg image, with intrinsic width='200', and with CSS height:auto"),
+ new Dimension(300, 150, "default sized svg image, with intrinsic width='200' height='200', and with CSS 'width:auto; height:auto'"),
+ new Dimension(300, 150, "default sized svg image, with intrinsic height, and with CSS 'width:auto; height:auto'"),
+ new Dimension(300, 150, "default sized svg image, with intrinsic width, and with CSS 'width:auto; height:auto'"),
+ new Dimension(300, 150, "default sized svg image, without intrinsic width and height, no css width/height specified"),
fs 2016/08/19 08:59:45 None these four have any intrinsic dimension. Actu
Shanmuga Pandi 2016/08/19 11:56:42 'specified <something>' could be correct ?
fs 2016/08/19 12:01:31 Maybe explicitly say "attributes width='..."' ..."
Shanmuga Pandi 2016/09/14 09:20:16 Done.
+];
+var images = document.getElementsByTagName('image');
+for (var i = 0, length = images.length; i < length; ++i) {
+ async_test(function(t) {
+ var image = images[i];
+ image.expectedBox = expectedBoxes[i];
+ image.onload = t.step_func_done(function() {
+ var rectBBox = image.getBBox();
+ assert_equals(rectBBox.width, image.expectedBox.width);
+ assert_equals(rectBBox.height, image.expectedBox.height);
+ });
+ }, document.title + ' with ' + expectedBoxes[i].desc + ' and box size should be ' + expectedBoxes[i]);
+}
+</script>

Powered by Google App Engine
This is Rietveld 408576698