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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side 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: applied intrinsic ratio Created 4 years, 3 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 unified diff | Download patch
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto-dynamic-image-change.html » ('j') | third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto-dynamic-image-change.html » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <title><svg:image> 'auto' sizing </title>
3 <script src="../../resources/testharness.js"></script>
4 <script src="../../resources/testharnessreport.js"></script>
5 <svg height="0">
6 <image width="100" height="100" xlink:href="resources/square-green-checker.png " />
7 <image width="200" height="100" xlink:href="resources/square-green-checker.png " style="width:auto"/>
8 <image width="100" height="200" xlink:href="resources/square-green-checker.png " style="height:auto"/>
9 <image width="100" height="100" xlink:href="resources/square-green-checker.png " style="width:auto; height:auto"/>
10 <image width="50" height="50"
11 xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'> </svg>"/>
12 <image width="50" height="50"
13 xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='width:auto; height:auto'/>
14 <image width="50" height="50"
15 xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='width:auto;'/>
16 <image xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='width:auto;'/>
17 <image height="50"
18 xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='width:auto;'/>
19 <image width="50"
20 xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='height:auto;'/>
21 <image width="200" height="200"
22 xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'> </svg>" style='width:auto; height:auto'/>
23 <image height="200"
24 xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'> </svg>" style='width:auto; height:auto'/>
25 <image width="200"
26 xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'> </svg>" style='width:auto; height:auto'/>
27 <image xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'> </svg>"/>
28 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' viewBox='0 0 400 100'></svg>"/>
29 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' viewBox='0 0 400 100'></svg>" style='width:auto'/>
30 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' viewBox='0 0 400 100'></svg>" style='height:auto'/>
31 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' viewBox='0 0 400 100'></svg>" style='width:auto; height:a uto'/>
32 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' width='200' viewBox='0 0 400 100'></svg>"/>
33 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' width='200' viewBox='0 0 400 100'></svg>" style='width:au to'/>
34 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' width='200' viewBox='0 0 400 100'></svg>" style='height:a uto'/>
35 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' width='200' viewBox='0 0 400 100'></svg>" style='width:au to; height:auto'/>
36 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' height='100' viewBox='0 0 400 100'></svg>"/>
37 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' height='100' viewBox='0 0 400 100'></svg>" style='width:a uto'/>
38 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' height='100' viewBox='0 0 400 100'></svg>" style='height: auto'/>
39 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' height='100' viewBox='0 0 400 100'></svg>" style='width:a uto; height:auto'/>
40 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' width='200' height='100' viewBox='0 0 400 100'></svg>"/>
41 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' width='200' height='100' viewBox='0 0 400 100'></svg>" st yle='width:auto'/>
42 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' width='200' height='100' viewBox='0 0 400 100'></svg>" st yle='height:auto'/>
43 <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http: //www.w3.org/2000/svg' width='200' height='100' viewBox='0 0 400 100'></svg>" st yle='width:auto; height:auto'/>
44 </svg>
45 <script>
46 var expectedBoxes = [
47 { dimensions: [100, 100], description: "400x400 png image, with attributes wid th='100' height='100'"},
fs 2016/09/14 11:31:52 I think we could drop all the instances of "with"
Shanmuga Pandi 2016/09/14 13:15:36 Done.
48 { dimensions: [100, 100], description: "400x400 png image, with attributes wid th='200' height='100', and with CSS 'width:auto'"},
49 { dimensions: [100, 100], description: "400x400 png image, with attributes wid th='100' height='200', and with CSS 'height:auto'"},
50 { dimensions: [400, 400], description: "400x400 png image, with attributes wid th='100' height='100', and with CSS 'width:auto; height:auto'"},
51 { dimensions: [50, 50], description: "default sized svg image, with attributes width='50' height='50'"},
52 { dimensions: [200, 100], description: "200x100 svg image, with attributes wid th='50' height='50', and with CSS 'width:auto; height:auto'"},
53 { dimensions: [100, 50], description: "200x100 svg image, with attributes widt h='50' height='50', and with CSS 'width:auto'"},
54 { dimensions: [200, 100], description: "200x100 svg image, without attributes width and height, and with CSS 'width:auto'"},
55 { dimensions: [100, 50], description: "200x100 svg image, with attributes heig ht='50', and with 'width:auto'"},
56 { dimensions: [50, 25], description: "200x100 svg image, with attributes width ='50', and with CSS height:auto"},
57 { dimensions: [300, 150], description: "default sized svg image, with attribut es width='200' height='200', and with CSS 'width:auto; height:auto'"},
58 { dimensions: [300, 150], description: "default sized svg image, with attribut es height='200', and with CSS 'width:auto; height:auto'"},
59 { dimensions: [300, 150], description: "default sized svg image, with attribut es width='200', and with CSS 'width:auto; height:auto'"},
60 { dimensions: [300, 150], description: "default sized svg image, without attri butes width and height, no css width/height specified"},
61 { dimensions: [60, 60], description: "default sized svg image with viewBox='0 0 400 100', with attributes width='60' height='60', no css width/height specifie d"},
62 { dimensions: [240, 60], description: "default sized svg image with viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'width:auto'"} ,
63 { dimensions: [60, 15], description: "default sized svg image with viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'height:auto'"} ,
64 { dimensions: [300, 75], description: "default sized svg image with viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'width:auto; h eight:auto'"},
65 { dimensions: [60, 60], description: "svg image with width='200' viewBox='0 0 400 100', with attributes width='60' height='60', no css width/height specified" },
66 { dimensions: [240, 60], description: "svg image with width='200' viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'width:auto'"},
67 { dimensions: [60, 15], description: "svg image with width='200' viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'height:auto'"},
68 { dimensions: [200, 50], description: "svg image with width='200' viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'width:auto; hei ght:auto'"},
69 { dimensions: [60, 60], description: "svg image with height='100' viewBox='0 0 400 100', with attributes width='60' height='60', no css width/height specified "},
70 { dimensions: [240, 60], description: "svg image with height='100' viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'width:auto'"},
71 { dimensions: [60, 15], description: "svg image with height='100' viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'height:auto'"},
72 { dimensions: [400, 100], description: "svg image with height='100' viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'width:auto; h eight:auto'"},
73 { dimensions: [60, 60], description: "200x100 svg image with viewBox='0 0 400 100', with attributes width='60' height='60', no css width/height specified"},
74 { dimensions: [120, 60], description: "200x100 svg image with viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'width:auto'"},
75 { dimensions: [60, 30], description: "200x100 svg image with viewBox='0 0 400 100', with attributes width='60' height='60', and with CSS 'height:auto'"},
76 { dimensions: [200, 100], description: "200x100 svg image with viewBox='0 0 40 0 100', with attributes width='60' height='60', and with CSS 'width:auto; height :auto'"},
77 ];
78
79 var images = document.getElementsByTagName('image');
80 for (var i = 0, length = images.length; i < length; ++i) {
81 async_test(function(t) {
82 var image = images[i];
83 image.expectedBox = expectedBoxes[i];
84 image.onload = t.step_func_done(function() {
85 var rectBBox = image.getBBox();
86 assert_equals(rectBBox.width, image.expectedBox.dimensions[0]);
87 assert_equals(rectBBox.height, image.expectedBox.dimensions[1]);
88 });
89 }, document.title + ' with ' + expectedBoxes[i].description);
90 }
91 </script>
OLDNEW
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto-dynamic-image-change.html » ('j') | third_party/WebKit/LayoutTests/svg/custom/svg-image-intrinsic-size-with-cssstyle-auto-dynamic-image-change.html » ('J')

Powered by Google App Engine
This is Rietveld 408576698