Upstream version 7.36.149.0
[platform/framework/web/crosswalk.git] / src / third_party / WebKit / LayoutTests / fast / shapes / parsing / parsing-shape-lengths.html
index 26d9f76..5ca5a6e 100644 (file)
@@ -5,7 +5,7 @@
 * { font-size: 16px; }
 div { font-size: 8px; }
 </style>
-<script src="../../js/resources/js-test-pre.js"></script>
+<script src="../../../resources/js-test.js"></script>
 </head>
 <body>
 <script src="parsing-test-utils.js"></script>
@@ -22,86 +22,75 @@ function getStyleValue(property, value) {
 
 function testStyleValue(value, expected) {
     if (expected === null)
-        shouldBeNull('getStyleValue("shape-inside", "' + value + '")');
+        shouldBeNull('getStyleValue("shape-outside", "' + value + '")');
     else
-        shouldBeEqualToString('getStyleValue("shape-inside", "' + value + '")', expected);
+        shouldBeEqualToString('getStyleValue("shape-outside", "' + value + '")', expected);
 }
 function testComputedStyleValue(value, expected) {
-    testShapeComputedProperty("shape-inside", value, expected);
+    testShapeComputedProperty("shape-outside", value, expected);
 }
 
 function testInvalidValue(property, value) {
     testStyleValue(value, null);
-    testComputedStyleValue(value, 'outside-shape');
+    testComputedStyleValue(value, 'none');
 }
 
 // absolute lengths - number serialization, units
-testStyleValue("circle(0, 0, 0)", "circle(0px, 0px, 0px)");
-testStyleValue("circle(-1px, +1px, 1px)", "circle(-1px, 1px, 1px)");
-testStyleValue("circle(-1.5px, +1.5px, 1.5px)", "circle(-1.5px, 1.5px, 1.5px)");
-testStyleValue("circle(-.5px, +.5px, .5px)", "circle(-0.5px, 0.5px, 0.5px)");
+testStyleValue("circle(0 at 0 0)", "circle(0px at 0% 0%)");
+testStyleValue("circle(1px at +1px -1px)", "circle(1px at 1px -1px)");
+testStyleValue("circle(1.5px at -1.5px +1.5px)", "circle(1.5px at -1.5px 1.5px)");
+testStyleValue("circle(.5px at -.5px +.5px)", "circle(0.5px at -0.5px 0.5px)");
 
-testStyleValue("rectangle(1cm, 1mm, 1in, 1px, 1pt, 1pc)", "rectangle(1cm, 1mm, 1in, 1px, 1pt, 1pc)");
-testStyleValue("inset-rectangle(1cm, 1mm, 1in, 1px, 1pt, 1pc)", "inset-rectangle(1cm, 1mm, 1in, 1px, 1pt, 1pc)");
+testStyleValue("inset(1cm 1mm 1in 1px round 1pt 1pc)", "inset(1cm 1mm 1in 1px round 1pt 1pc)");
+testStyleValue("inset(-1px 1px 1px 1px round 1px 1px 1px 1px)", "inset(-1px 1px 1px round 1px)");
+testStyleValue("inset(1px -1px 1px 1px round 1px 1px 1px 1px)", "inset(1px -1px 1px 1px round 1px)");
+testStyleValue("inset(1px 1px -1px 1px round 1px 1px 1px 1px)", "inset(1px 1px -1px round 1px)");
+testStyleValue("inset(1px 1px 1px -1px round 1px 1px 1px 1px)", "inset(1px 1px 1px -1px round 1px)");
 
 // font-relative lengths - number serialization, units, resolution
-testStyleValue("circle(-1em, +1em, 1em)", "circle(-1em, 1em, 1em)");
-testStyleValue("circle(-1.5em, +1.5em, 1.5em)", "circle(-1.5em, 1.5em, 1.5em)");
-testStyleValue("circle(-.5em, +.5em, .5em)", "circle(-0.5em, 0.5em, 0.5em)");
+testStyleValue("circle(1em at -1em +1em)", "circle(1em at -1em 1em)");
+testStyleValue("circle(1.5em at -1.5em +1.5em)", "circle(1.5em at -1.5em 1.5em)");
+testStyleValue("circle(.5em at -.5em +.5em)", "circle(0.5em at -0.5em 0.5em)");
 
-testStyleValue("circle(1ex, 1ex, 1ex)", "circle(1ex, 1ex, 1ex)");
+testStyleValue("circle(1ex at 1ex 1ex)", "circle(1ex at 1ex 1ex)");
 // FIXME: Add ch test when it is supported
-testStyleValue("circle(1rem, 1rem, 1rem)", "circle(1rem, 1rem, 1rem)");
+testStyleValue("circle(1rem at 1rem 1rem)", "circle(1rem at 1rem 1rem)");
 
-testComputedStyleValue("circle(.5em, 1em, 1.5em)", "circle(4px, 8px, 12px)");
-testComputedStyleValue("circle(.5rem, 1rem, 1.5rem)", "circle(8px, 16px, 24px)");
+testComputedStyleValue("circle(1.5em at .5em 1em)", "circle(12px at 4px 8px)");
+testComputedStyleValue("circle(1.5rem at .5rem 1rem)", "circle(24px at 8px 16px)");
 
 // viewport-percentage lengths - units, resolution
-testStyleValue("circle(1vw, 1vw, 1vw)", "circle(1vw, 1vw, 1vw)");
-testStyleValue("circle(1vh, 1vh, 1vh)", "circle(1vh, 1vh, 1vh)");
-testStyleValue("circle(1vmin, 1vmin, 1vmin)", "circle(1vmin, 1vmin, 1vmin)");
+testStyleValue("circle(1vw at 1vw 1vw)", "circle(1vw at 1vw 1vw)");
+testStyleValue("circle(1vh at 1vh 1vh)", "circle(1vh at 1vh 1vh)");
+testStyleValue("circle(1vmin at 1vmin 1vmin)", "circle(1vmin at 1vmin 1vmin)");
 
-testComputedStyleValue("circle(.5vw, 1vw, 1.5vw)", "circle(0.5vw, 1vw, 1.5vw)");
-testComputedStyleValue("circle(.5vh, 1vh, 1.5vh)", "circle(0.5vh, 1vh, 1.5vh)");
-testComputedStyleValue("circle(.5vmin, 1vmin, 1.5vmin)", "circle(0.5vmin, 1vmin, 1.5vmin)");
+testComputedStyleValue("circle(1.5vw at .5vw 1vw)", "circle(12px at 4px 8px)");
+testComputedStyleValue("circle(1.5vh at .5vh 1vh)", "circle(9px at 3px 6px)");
+testComputedStyleValue("circle(1.5vmin at .5vmin 1vmin)", "circle(9px at 3px 6px)");
 
 // percentage lengths - units
-testStyleValue("circle(100%, 100%, 100%)", "circle(100%, 100%, 100%)");
-testStyleValue("rectangle(45%, 45%, 90%, 60%, 25%, 10%)", "rectangle(45%, 45%, 90%, 60%, 25%, 10%)");
-testStyleValue("inset-rectangle(45%, 45%, 90%, 60%, 25%, 10%)", "inset-rectangle(45%, 45%, 90%, 60%, 25%, 10%)");
-testStyleValue("ellipse(100%, 100%, 100%, 100%)", "ellipse(100%, 100%, 100%, 100%)");
-testStyleValue("polygon(10% 20%, 30% 40%, 40% 50%)", "polygon(nonzero, 10% 20%, 30% 40%, 40% 50%)");
-
-testComputedStyleValue("circle(50%, 100%, 150%)", "circle(50%, 100%, 150%)");
-testComputedStyleValue("rectangle(45%, 45%, 90%, 60%, 25%, 10%)", "rectangle(45%, 45%, 90%, 60%, 25%, 10%)");
-testComputedStyleValue("inset-rectangle(45%, 45%, 90%, 60%, 25%, 10%)", "inset-rectangle(45%, 45%, 90%, 60%, 25%, 10%)");
-testComputedStyleValue("ellipse(100%, 100%, 100%, 100%)", "ellipse(100%, 100%, 100%, 100%)");
-testComputedStyleValue("polygon(10% 20%, 30% 40%, 40% 50%)", "polygon(nonzero, 10% 20%, 30% 40%, 40% 50%)");
+testStyleValue("circle(100% at 100% 100%)", "circle(100% at 100% 100%)");
+testStyleValue("inset(45% 45% 90% 60% round 25% 10%)", "inset(45% 45% 90% 60% round 25% 10%)");
+testStyleValue("ellipse(100% 100% at 100% 100%)", "ellipse(100% 100% at 100% 100%)");
+testStyleValue("polygon(10% 20%, 30% 40%, 40% 50%)", "polygon(10% 20%, 30% 40%, 40% 50%)");
+
+testComputedStyleValue("circle(150% at 50% 100%)", "circle(150% at 50% 100%)");
+testComputedStyleValue("inset(45% 45% 90% 60% round 25% 10%)", "inset(45% 45% 90% 60% round 25% 10%)");
+testComputedStyleValue("ellipse(100% 100% at 100% 100%)", "ellipse(100% 100% at 100% 100%)");
+testComputedStyleValue("polygon(10% 20%, 30% 40%, 40% 50%)", "polygon(10% 20%, 30% 40%, 40% 50%)");
 
 // reject non-lengths
-testInvalidValue("shape-inside", "circle(1px, 1px, 1)");
-testInvalidValue("shape-inside", "circle(1px, 1px, px)");
-testInvalidValue("shape-inside", "circle(1px, 1px, 1p)");
-testInvalidValue("shape-inside", "circle(1px, 1px, calc())");
+testInvalidValue("-webkit-shape-outside", "circle(1 at 1px 1px)");
+testInvalidValue("-webkit-shape-outside", "circle(px at 1px 1px)");
+testInvalidValue("-webkit-shape-outside", "circle(1p at 1px 1px)");
+testInvalidValue("-webkit-shape-outside", "circle(calc( at 1px 1px))");
 
 // reject negative radiuses
-testInvalidValue("shape-inside", "circle(-1.5px, +1.5px, -1.5px)");
-testInvalidValue("shape-inside", "rectangle(1cm, 1mm, 1in, 1px, -1pt, 1pc)");
-testInvalidValue("shape-inside", "rectangle(1cm, 1mm, 1in, 1px, 1pt, -1pc)");
-testInvalidValue("shape-inside", "inset-rectangle(1cm, 1mm, 1in, 1px, -1pt, 1pc)");
-testInvalidValue("shape-inside", "inset-rectangle(1cm, 1mm, 1in, 1px, 1pt, -1pc)");
-testInvalidValue("shape-inside", "ellipse(1em, 1em, -1em, 1em)");
-testInvalidValue("shape-inside", "ellipse(1em, 1em, 1em, -1em)");
-
-// reject negative height and width
-testInvalidValue("shape-inside", "rectangle(1cm, 1mm, -1in, 1px, 1pt, 1pc)");
-testInvalidValue("shape-inside", "rectangle(1cm, 1mm, 1in, -1px, 1pt, 1pc)");
-
-// reject negative top, right, bottom, and left
-testInvalidValue("shape-inside", "inset-rectangle(-1cm, 1mm, 1in, 1px, 1pt, 1pc)");
-testInvalidValue("shape-inside", "inset-rectangle(1cm, -1mm, 1in, 1px, 1pt, 1pc)");
-testInvalidValue("shape-inside", "inset-rectangle(1cm, 1mm, -1in, 1px, 1pt, 1pc)");
-testInvalidValue("shape-inside", "inset-rectangle(1cm, 1mm, 1in, -1px, 1pt, 1pc)");
+testInvalidValue("shape-outside", "circle(-1.5px at -1.5px +1.5px)");
+testInvalidValue("shape-outside", "inset(1cm 1mm 1in 1px round 1pt -1pc)");
+testInvalidValue("shape-outside", "ellipse(-1em 1em at 1em 1em)");
+testInvalidValue("shape-outside", "ellipse(1em -1em at 1em 1em)");
+
 </script>
 </body>
 </html>