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

Side by Side Diff: LayoutTests/fast/shapes/parsing/parsing-shape-lengths.html

Issue 200633005: [CSS Shapes] Remove deprecated shapes (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Rebase against ToR Created 6 years, 9 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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <style> 4 <style>
5 * { font-size: 16px; } 5 * { font-size: 16px; }
6 div { font-size: 8px; } 6 div { font-size: 8px; }
7 </style> 7 </style>
8 <script src="../../../resources/js-test.js"></script> 8 <script src="../../../resources/js-test.js"></script>
9 </head> 9 </head>
10 <body> 10 <body>
(...skipping 18 matching lines...) Expand all
29 function testComputedStyleValue(value, expected) { 29 function testComputedStyleValue(value, expected) {
30 testShapeComputedProperty("shape-inside", value, expected); 30 testShapeComputedProperty("shape-inside", value, expected);
31 } 31 }
32 32
33 function testInvalidValue(property, value) { 33 function testInvalidValue(property, value) {
34 testStyleValue(value, null); 34 testStyleValue(value, null);
35 testComputedStyleValue(value, 'none'); 35 testComputedStyleValue(value, 'none');
36 } 36 }
37 37
38 // absolute lengths - number serialization, units 38 // absolute lengths - number serialization, units
39 testStyleValue("circle(0, 0, 0)", "circle(0px, 0px, 0px)"); 39 testStyleValue("circle(0 at 0 0)", "circle(0px at 0% 0%)");
40 testStyleValue("circle(-1px, +1px, 1px)", "circle(-1px, 1px, 1px)"); 40 testStyleValue("circle(1px at +1px -1px)", "circle(1px at 1px -1px)");
41 testStyleValue("circle(-1.5px, +1.5px, 1.5px)", "circle(-1.5px, 1.5px, 1.5px)"); 41 testStyleValue("circle(1.5px at -1.5px +1.5px)", "circle(1.5px at -1.5px 1.5px)" );
42 testStyleValue("circle(-.5px, +.5px, .5px)", "circle(-0.5px, 0.5px, 0.5px)"); 42 testStyleValue("circle(.5px at -.5px +.5px)", "circle(0.5px at -0.5px 0.5px)");
43 43
44 testStyleValue("rectangle(1cm, 1mm, 1in, 1px, 1pt, 1pc)", "rectangle(1cm, 1mm, 1 in, 1px, 1pt, 1pc)");
45 testStyleValue("inset-rectangle(1cm, 1mm, 1in, 1px, 1pt, 1pc)", "inset-rectangle (1cm, 1mm, 1in, 1px, 1pt, 1pc)");
46 testStyleValue("inset(1cm 1mm 1in 1px round 1pt 1pc)", "inset(1cm 1mm 1in 1px ro und 1pt 1pc 1pt 1pc / 1pt 1pc 1pt 1pc)"); 44 testStyleValue("inset(1cm 1mm 1in 1px round 1pt 1pc)", "inset(1cm 1mm 1in 1px ro und 1pt 1pc 1pt 1pc / 1pt 1pc 1pt 1pc)");
47 testStyleValue("inset(-1cm 1mm 1in 1px round 1pt 1pc)", "inset(-1cm 1mm 1in 1px round 1pt 1pc 1pt 1pc / 1pt 1pc 1pt 1pc)"); 45 testStyleValue("inset(-1cm 1mm 1in 1px round 1pt 1pc)", "inset(-1cm 1mm 1in 1px round 1pt 1pc 1pt 1pc / 1pt 1pc 1pt 1pc)");
48 testStyleValue("inset(-1cm 1mm -1in 1px round 1pt 1pc)", "inset(-1cm 1mm -1in 1p x round 1pt 1pc 1pt 1pc / 1pt 1pc 1pt 1pc)"); 46 testStyleValue("inset(-1cm 1mm -1in 1px round 1pt 1pc)", "inset(-1cm 1mm -1in 1p x round 1pt 1pc 1pt 1pc / 1pt 1pc 1pt 1pc)");
49 47
50 // font-relative lengths - number serialization, units, resolution 48 // font-relative lengths - number serialization, units, resolution
51 testStyleValue("circle(-1em, +1em, 1em)", "circle(-1em, 1em, 1em)"); 49 testStyleValue("circle(1em at -1em +1em)", "circle(1em at -1em 1em)");
52 testStyleValue("circle(-1.5em, +1.5em, 1.5em)", "circle(-1.5em, 1.5em, 1.5em)"); 50 testStyleValue("circle(1.5em at -1.5em +1.5em)", "circle(1.5em at -1.5em 1.5em)" );
53 testStyleValue("circle(-.5em, +.5em, .5em)", "circle(-0.5em, 0.5em, 0.5em)"); 51 testStyleValue("circle(.5em at -.5em +.5em)", "circle(0.5em at -0.5em 0.5em)");
54 52
55 testStyleValue("circle(1ex, 1ex, 1ex)", "circle(1ex, 1ex, 1ex)"); 53 testStyleValue("circle(1ex at 1ex 1ex)", "circle(1ex at 1ex 1ex)");
56 // FIXME: Add ch test when it is supported 54 // FIXME: Add ch test when it is supported
57 testStyleValue("circle(1rem, 1rem, 1rem)", "circle(1rem, 1rem, 1rem)"); 55 testStyleValue("circle(1rem at 1rem 1rem)", "circle(1rem at 1rem 1rem)");
58 56
59 testComputedStyleValue("circle(.5em, 1em, 1.5em)", "circle(4px, 8px, 12px)"); 57 testComputedStyleValue("circle(1.5em at .5em 1em)", "circle(12px at 4px 8px)");
60 testComputedStyleValue("circle(.5rem, 1rem, 1.5rem)", "circle(8px, 16px, 24px)") ; 58 testComputedStyleValue("circle(1.5rem at .5rem 1rem)", "circle(24px at 8px 16px) ");
61 59
62 // viewport-percentage lengths - units, resolution 60 // viewport-percentage lengths - units, resolution
63 testStyleValue("circle(1vw, 1vw, 1vw)", "circle(1vw, 1vw, 1vw)"); 61 testStyleValue("circle(1vw at 1vw 1vw)", "circle(1vw at 1vw 1vw)");
64 testStyleValue("circle(1vh, 1vh, 1vh)", "circle(1vh, 1vh, 1vh)"); 62 testStyleValue("circle(1vh at 1vh 1vh)", "circle(1vh at 1vh 1vh)");
65 testStyleValue("circle(1vmin, 1vmin, 1vmin)", "circle(1vmin, 1vmin, 1vmin)"); 63 testStyleValue("circle(1vmin at 1vmin 1vmin)", "circle(1vmin at 1vmin 1vmin)");
66 64
67 testComputedStyleValue("circle(.5vw, 1vw, 1.5vw)", "circle(4px, 8px, 12px)"); 65 testComputedStyleValue("circle(1.5vw at .5vw 1vw)", "circle(1.5vw at 0.5vw 1vw)" );
68 testComputedStyleValue("circle(.5vh, 1vh, 1.5vh)", "circle(3px, 6px, 9px)"); 66 testComputedStyleValue("circle(1.5vh at .5vh 1vh)", "circle(1.5vh at 0.5vh 1vh)" );
69 testComputedStyleValue("circle(.5vmin, 1vmin, 1.5vmin)", "circle(3px, 6px, 9px)" ); 67 testComputedStyleValue("circle(1.5vmin at .5vmin 1vmin)", "circle(1.5vmin at 0.5 vmin 1vmin)");
70 68
71 // percentage lengths - units 69 // percentage lengths - units
72 testStyleValue("circle(100%, 100%, 100%)", "circle(100%, 100%, 100%)"); 70 testStyleValue("circle(100% at 100% 100%)", "circle(100% at 100% 100%)");
73 testStyleValue("rectangle(45%, 45%, 90%, 60%, 25%, 10%)", "rectangle(45%, 45%, 9 0%, 60%, 25%, 10%)");
74 testStyleValue("inset-rectangle(45%, 45%, 90%, 60%, 25%, 10%)", "inset-rectangle (45%, 45%, 90%, 60%, 25%, 10%)");
75 testStyleValue("inset(45% 45% 90% 60% round 25% 10%)", "inset(45% 45% 90% 60% ro und 25% 10% 25% 10% / 25% 10% 25% 10%)"); 71 testStyleValue("inset(45% 45% 90% 60% round 25% 10%)", "inset(45% 45% 90% 60% ro und 25% 10% 25% 10% / 25% 10% 25% 10%)");
76 testStyleValue("ellipse(100%, 100%, 100%, 100%)", "ellipse(100%, 100%, 100%, 100 %)"); 72 testStyleValue("ellipse(100% 100% at 100% 100%)", "ellipse(100% 100% at 100% 100 %)");
77 testStyleValue("polygon(10% 20%, 30% 40%, 40% 50%)", "polygon(10% 20%, 30% 40%, 40% 50%)"); 73 testStyleValue("polygon(10% 20%, 30% 40%, 40% 50%)", "polygon(10% 20%, 30% 40%, 40% 50%)");
78 74
79 testComputedStyleValue("circle(50%, 100%, 150%)", "circle(50%, 100%, 150%)"); 75 testComputedStyleValue("circle(150% at 50% 100%)", "circle(150% at 50% 100%)");
80 testComputedStyleValue("rectangle(45%, 45%, 90%, 60%, 25%, 10%)", "rectangle(45% , 45%, 90%, 60%, 25%, 10%)");
81 testComputedStyleValue("inset-rectangle(45%, 45%, 90%, 60%, 25%, 10%)", "inset-r ectangle(45%, 45%, 90%, 60%, 25%, 10%)");
82 testComputedStyleValue("inset(45% 45% 90% 60% round 25% 10%)", "inset(45% 45% 90 % 60% round 25% 10% 25% 10% / 25% 10% 25% 10%)"); 76 testComputedStyleValue("inset(45% 45% 90% 60% round 25% 10%)", "inset(45% 45% 90 % 60% round 25% 10% 25% 10% / 25% 10% 25% 10%)");
83 testComputedStyleValue("ellipse(100%, 100%, 100%, 100%)", "ellipse(100%, 100%, 1 00%, 100%)"); 77 testComputedStyleValue("ellipse(100% 100% at 100% 100%)", "ellipse(100% 100% at 100% 100%)");
84 testComputedStyleValue("polygon(10% 20%, 30% 40%, 40% 50%)", "polygon(10% 20%, 3 0% 40%, 40% 50%)"); 78 testComputedStyleValue("polygon(10% 20%, 30% 40%, 40% 50%)", "polygon(10% 20%, 3 0% 40%, 40% 50%)");
85 79
86 // reject non-lengths 80 // reject non-lengths
87 testInvalidValue("shape-inside", "circle(1px, 1px, 1)"); 81 testInvalidValue("-webkit-shape-outside", "circle(1 at 1px 1px)");
88 testInvalidValue("shape-inside", "circle(1px, 1px, px)"); 82 testInvalidValue("-webkit-shape-outside", "circle(px at 1px 1px)");
89 testInvalidValue("shape-inside", "circle(1px, 1px, 1p)"); 83 testInvalidValue("-webkit-shape-outside", "circle(1p at 1px 1px)");
90 testInvalidValue("shape-inside", "circle(1px, 1px, calc())"); 84 testInvalidValue("-webkit-shape-outside", "circle(calc( at 1px 1px))");
91 85
92 // reject negative radiuses 86 // reject negative radiuses
93 testInvalidValue("shape-inside", "circle(-1.5px, +1.5px, -1.5px)"); 87 testInvalidValue("shape-outside", "circle(-1.5px, +1.5px, -1.5px)");
94 testInvalidValue("shape-inside", "rectangle(1cm, 1mm, 1in, 1px, -1pt, 1pc)"); 88 testInvalidValue("shape-outside", "inset(1cm 1mm 1in 1px round 1pt -1pc)");
95 testInvalidValue("shape-inside", "rectangle(1cm, 1mm, 1in, 1px, 1pt, -1pc)"); 89 testInvalidValue("shape-outside", "ellipse(1em, 1em, -1em, 1em)");
96 testInvalidValue("shape-inside", "inset-rectangle(1cm, 1mm, 1in, 1px, -1pt, 1pc) "); 90 testInvalidValue("shape-outside", "ellipse(1em, 1em, 1em, -1em)");
97 testInvalidValue("shape-inside", "inset-rectangle(1cm, 1mm, 1in, 1px, 1pt, -1pc) ");
98 testInvalidValue("shape-inside", "inset(1cm 1mm 1in 1px round 1pt -1pc)");
99 testInvalidValue("shape-inside", "ellipse(1em, 1em, -1em, 1em)");
100 testInvalidValue("shape-inside", "ellipse(1em, 1em, 1em, -1em)");
101
102 // reject negative height and width
103 testInvalidValue("shape-inside", "rectangle(1cm, 1mm, -1in, 1px, 1pt, 1pc)");
104 testInvalidValue("shape-inside", "rectangle(1cm, 1mm, 1in, -1px, 1pt, 1pc)");
105
106 // reject negative top, right, bottom, and left
107 testInvalidValue("shape-inside", "inset-rectangle(-1cm, 1mm, 1in, 1px, 1pt, 1pc) ");
108 testInvalidValue("shape-inside", "inset-rectangle(1cm, -1mm, 1in, 1px, 1pt, 1pc) ");
109 testInvalidValue("shape-inside", "inset-rectangle(1cm, 1mm, -1in, 1px, 1pt, 1pc) ");
110 testInvalidValue("shape-inside", "inset-rectangle(1cm, 1mm, 1in, -1px, 1pt, 1pc) ");
111 </script> 91 </script>
112 </body> 92 </body>
113 </html> 93 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698