Update CSS tests to revision 0698c2aa9ead844b6d7d10eafb096cb1118e13ef

This commit is contained in:
Ms2ger 2015-12-09 01:48:05 -05:00
parent 9aa1b1e408
commit 35c74aecc2
11290 changed files with 92400 additions and 49214 deletions

View file

@ -50,7 +50,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Left and right float with shape-outside with clipped left float
<ul class="assert">
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the left float shape is clipped to the float&amp;acirc;&amp;#8364;&amp;#8482;s margin box</li>
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the left float shape is clipped to the float's margin box</li>
</ul>
</td>
</tr>
@ -61,7 +61,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Left and right float with shape-outside with clipped right float
<ul class="assert">
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the right float shape is clipped to the float&amp;acirc;&amp;#8364;&amp;#8482;s margin box</li>
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the right float shape is clipped to the float's margin box</li>
</ul>
</td>
</tr>
@ -72,7 +72,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inset with no extent and inline content - inset(50% 50% 50% 50%)
<ul class="assert">
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float&amp;acirc;&amp;#8364;&amp;#8482;s box.</li>
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float's box.</li>
</ul>
</td>
</tr>
@ -83,7 +83,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inset with no extent and inline content - inset(150% 150% 0% 0%)
<ul class="assert">
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float&amp;acirc;&amp;#8364;&amp;#8482;s box.</li>
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float's box.</li>
</ul>
</td>
</tr>

View file

@ -84,7 +84,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Left and right float with shape-outside with clipped left float
<ul class="assert">
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the left float shape is clipped to the float&amp;acirc;&amp;#8364;&amp;#8482;s margin box</li>
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the left float shape is clipped to the float's margin box</li>
</ul>
</td>
</tr>
@ -95,7 +95,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Left and right float with shape-outside with clipped right float
<ul class="assert">
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the right float shape is clipped to the float&amp;acirc;&amp;#8364;&amp;#8482;s margin box</li>
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the right float shape is clipped to the float's margin box</li>
</ul>
</td>
</tr>
@ -106,7 +106,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inset with no extent and inline content - inset(50% 50% 50% 50%)
<ul class="assert">
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float&amp;acirc;&amp;#8364;&amp;#8482;s box.</li>
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float's box.</li>
</ul>
</td>
</tr>
@ -117,7 +117,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inset with no extent and inline content - inset(150% 150% 0% 0%)
<ul class="assert">
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float&amp;acirc;&amp;#8364;&amp;#8482;s box.</li>
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float's box.</li>
</ul>
</td>
</tr>

View file

@ -342,7 +342,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Left and right float with shape-outside with clipped left float
<ul class="assert">
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the left float shape is clipped to the float&amp;acirc;&amp;#8364;&amp;#8482;s margin box</li>
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the left float shape is clipped to the float's margin box</li>
</ul>
</td>
</tr>
@ -353,7 +353,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Left and right float with shape-outside with clipped right float
<ul class="assert">
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the right float shape is clipped to the float&amp;acirc;&amp;#8364;&amp;#8482;s margin box</li>
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the right float shape is clipped to the float's margin box</li>
</ul>
</td>
</tr>
@ -364,7 +364,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inset with no extent and inline content - inset(50% 50% 50% 50%)
<ul class="assert">
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float&amp;acirc;&amp;#8364;&amp;#8482;s box.</li>
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float's box.</li>
</ul>
</td>
</tr>
@ -375,7 +375,7 @@
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inset with no extent and inline content - inset(150% 150% 0% 0%)
<ul class="assert">
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float&amp;acirc;&amp;#8364;&amp;#8482;s box.</li>
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float's box.</li>
</ul>
</td>
</tr>

View file

@ -11,12 +11,12 @@
top: 70px;
}
.left-rect {
left: 10px;
left: 10px;
}
.right-rect {
width: 50px;
height: 100px;
left: 70px;
left: 70px;
background: rgb(0,100,0);
}
.blue {
@ -40,4 +40,5 @@
<div class="blue left-line"></div>
<div class="blue right-line"></div>
</body></html>

View file

@ -13,7 +13,7 @@
}
.left-rect { left: 10px; }
.right-rect { left: 70px; }
.blue {
width: 2px;
height: 100px;
@ -38,4 +38,5 @@
<div class="blue left-line"></div>
<div class="blue right-line"></div>
</body></html>

View file

@ -13,7 +13,7 @@
}
.left-rect { left: 10px; }
.right-rect { left: 120px; }
.blue {
width: 2px;
height: 200px;
@ -38,4 +38,5 @@
<div class="blue left-line"></div>
<div class="blue right-line"></div>
</body></html>

View file

@ -58,7 +58,7 @@
<p>
The test passes if the green shape does not intersect either of the triangles and
there is one green horizontal bar beneath the triangles. There should be no red.
</p>
</p>
<div id="container">
<div id="level-1">
XXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXX
@ -80,4 +80,5 @@
<div id="left-triangle"></div>
<div id="right-triangle"></div>
</body></html>

View file

@ -20,7 +20,7 @@
border: 1px solid black;
z-index: 10;
}
</style>
</head>
<body>
@ -28,16 +28,17 @@
The test passes if there are two columns of six green horizontal bars of the same
size inside the square and two columns of six matching green bars outside and to the
right of the square. There should be no red.
</p>
</p>
<div id="container">
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
</div>
<div id="square"></div>
</body></html>

View file

@ -11,7 +11,7 @@
border: 1px solid black;
}
#failure-container {
}
#margin-line {
position: absolute;
@ -73,7 +73,7 @@
The test passes if one green bar is inside the top rectangle, four green bars
are in the bottom rectangle, and none intersect the triangles. There should be no
red.
</p>
</p>
<div id="container">
<div class="fail" id="bar-1"></div>
<div class="fail" id="bar-2"></div>
@ -85,4 +85,5 @@
<div class="triangle" id="triangle-1"></div>
<div class="triangle" id="triangle-2"></div>
</body></html>

View file

@ -50,7 +50,7 @@
X<br>
X
</div>
<script src="../../support/rounded-rectangle.js"></script>
<script src="../../support/subpixel-utils.js"></script>
<script>

View file

@ -46,7 +46,7 @@
X<br>
X
</div>
<script src="../../support/rounded-rectangle.js"></script>
<script src="../../support/subpixel-utils.js"></script>
<script>

View file

@ -7,7 +7,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-margin-property" rel="help">
<link href="reference/shape-image-006-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that content wraps around all the image pixels
<meta content="This test verifies that content wraps around all the image pixels
+ the shape-margin when shape-outside is given a png file." name="assert">
<style type="text/css">
body {
@ -60,4 +60,5 @@
<div class="blue right-line"></div>
<div class="failure"></div>
</body></html>

View file

@ -7,7 +7,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-margin-property" rel="help">
<link href="reference/shape-image-007-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that content wraps around all the image pixels
<meta content="This test verifies that content wraps around all the image pixels
+ the shape-margin when shape-outside is given an svg file." name="assert">
<style type="text/css">
body {
@ -60,4 +60,5 @@
<div class="blue right-line"></div>
<div class="failure"></div>
</body></html>

View file

@ -7,7 +7,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-margin-property" rel="help">
<link href="reference/shape-image-008-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that content wraps around all the image pixels
<meta content="This test verifies that content wraps around all the image pixels
+ the shape-margin as a percentage when shape-outside is given an jpg data uri." name="assert">
<style type="text/css">
body {
@ -65,4 +65,5 @@
<div class="blue line-right"></div>
<div class="failure"></div>
</body></html>

View file

@ -9,7 +9,7 @@
<link href="reference/shape-image-006-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that content wraps around the image pixels extracted from
a shape-outside png file with shape-image-threshold set + the shape-margin as
a shape-outside png file with shape-image-threshold set + the shape-margin as
a percentage." name="assert">
<style type="text/css">
body { margin: 0; }
@ -74,4 +74,5 @@
<div class="blue right-line"></div>
<div class="failure"></div>
</body></html>

View file

@ -6,7 +6,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<link href="reference/shape-image-024-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that content wraps around all the image pixels
<meta content="This test verifies that content wraps around all the image pixels
calculated from the size of the img element, which is different
than the size of the image itself." name="assert">
<style type="text/css">
@ -62,4 +62,5 @@
<div class="blue right-line"></div>
<div class="failure"></div>
</body></html>

View file

@ -31,7 +31,7 @@
width: 50px;
height: 50px;
}
.green {
.green {
left: 10px;
background-color: rgb(0,100,0);
}

View file

@ -7,7 +7,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<link href="reference/shape-outside-001-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that left floats with a shape-outside
<meta content="This test verifies that left floats with a shape-outside
only allow content wrapping on the right side, and right floats only allow wrapping on
the left." name="assert">
<!-- This test is derived from Example 1 in this version of the spec:
@ -73,7 +73,7 @@
<p>
The test passes if the green shape does not intersect either of the triangles and
there is one green horizontal bar beneath the triangles. There should be no red.
</p>
</p>
<div class="container" id="test">
<div id="test-float-left"></div>
<div id="test-float-right"></div>
@ -96,4 +96,5 @@
<div id="left-triangle"></div>
<div id="right-triangle"></div>
</body></html>

View file

@ -7,9 +7,9 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<link href="reference/shape-outside-001-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that left floats with a shape-outside
<meta content="This test verifies that left floats with a shape-outside
only allow content wrapping on the right side, and right floats only allow wrapping on
the left and that the left float shape is clipped to the floats margin box" name="assert">
the left and that the left float shape is clipped to the float's margin box" name="assert">
<!-- This test is derived from Example 2 in this version of the spec:
http://www.w3.org/TR/2013/WD-css-shapes-1-20131203/ -->
<style type="text/css">
@ -73,7 +73,7 @@
<p>
The test passes if the green shape does not intersect either of the triangles and
there is one green horizontal bar beneath the triangles. There should be no red.
</p>
</p>
<div class="container" id="test">
<div id="test-float-left"></div>
<div id="test-float-right"></div>
@ -96,4 +96,5 @@
<div id="left-triangle"></div>
<div id="right-triangle"></div>
</body></html>

View file

@ -7,9 +7,9 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<link href="reference/shape-outside-001-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that left floats with a shape-outside
<meta content="This test verifies that left floats with a shape-outside
only allow content wrapping on the right side, and right floats only allow wrapping on
the left and that the right float shape is clipped to the floats margin box" name="assert">
the left and that the right float shape is clipped to the float's margin box" name="assert">
<!-- This test is derived from Example 2 in this version of the spec:
http://www.w3.org/TR/2013/WD-css-shapes-1-20131203/ -->
<style type="text/css">
@ -73,7 +73,7 @@
<p>
The test passes if the green shape does not intersect either of the triangles and
there is one green horizontal bar beneath the triangles. There should be no red.
</p>
</p>
<div class="container" id="test">
<div id="test-float-left"></div>
<div id="test-float-right"></div>
@ -96,4 +96,5 @@
<div id="left-triangle"></div>
<div id="right-triangle"></div>
</body></html>

View file

@ -8,7 +8,7 @@
<link href="reference/shape-outside-004-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that a shape with no extent allow inline
content to flow through all of the floats box." name="assert">
content to flow through all of the float's box." name="assert">
<!-- This test is derived from Example 3 in this version of the spec:
http://www.w3.org/TR/2013/WD-css-shapes-1-20131203/ -->
<style type="text/css">
@ -25,7 +25,7 @@
shape-outside: inset(50% 50% 50% 50%);
float: left;
width: 200px;
height: 200px;
height: 200px;
}
#failure {
color: red;
@ -50,26 +50,27 @@
The test passes if there are two columns of six green horizontal bars of the same
size inside the square and two columns of six matching green bars outside and to the
right of the square. There should be no red.
</p>
</p>
<div class="container" id="test">
<div id="test-float-left"></div>
XXXX XXXX
XXXX XXXX
XXXX XXXX
XXXX XXXX
XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
</div>
<div class="container" id="failure">
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
</div>
<div id="square"></div>
</body></html>

View file

@ -8,7 +8,7 @@
<link href="reference/shape-outside-004-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that a shape with no extent allow inline
content to flow through all of the floats box." name="assert">
content to flow through all of the float's box." name="assert">
<!-- This test is derived from Example 3 in this version of the spec:
http://www.w3.org/TR/2013/WD-css-shapes-1-20131203/ -->
<style type="text/css">
@ -25,7 +25,7 @@
shape-outside: inset(150% 150% 0% 0%);
float: left;
width: 200px;
height: 200px;
height: 200px;
}
#failure {
color: red;
@ -50,26 +50,27 @@
The test passes if there are two columns of six green horizontal bars of the same
size inside the square and two columns of six matching green bars outside and to the
right of the square. There should be no red.
</p>
</p>
<div class="container" id="test">
<div id="test-float-left"></div>
XXXX XXXX
XXXX XXXX
XXXX XXXX
XXXX XXXX
XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
</div>
<div class="container" id="failure">
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
XXXX XXXX XXXX XXXX
</div>
<div id="square"></div>
</body></html>

View file

@ -1,6 +1,6 @@
<!DOCTYPE html>
<html><head>
<title>CSS Test: shape-outside with open areas on both the left &amp; right of
<title>CSS Test: shape-outside with open areas on both the left &amp; right of
the float area</title>
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck">
<link href="http://www.w3.org/TR/css-shapes-1/#relation-to-box-model-and-float-behavior" rel="help">
@ -8,7 +8,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<link href="reference/shape-outside-006-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that content wraps only on one side of
<meta content="This test verifies that content wraps only on one side of
the float even though there is open area on both the left
and right sides of the float." name="assert">
<!-- This test is derived from Example 4 in this version of the spec:
@ -66,7 +66,7 @@
background-color: lightblue;
clip-path: polygon(50px 0px, 100px 100px, 0px 100px);
}
</style>
</head>
<body>
@ -86,4 +86,5 @@
</div>
<div id="triangle"></div>
</body></html>

View file

@ -75,7 +75,7 @@
background-color: lightblue;
margin-left: 2px;
clip-path: polygon(0% 50%, 50% 100%, 0 100%);;
}
</style>
</head>
@ -83,7 +83,7 @@
<p>
The test passes if one green bar is inside the top rectangle, three green bars
are in the bottom rectangle, and none intersect the triangle. There should be no red.
</p>
</p>
<div class="container" id="test">
<div id="test-float-left"></div>
XXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXX XXXXXXXXXX
@ -97,4 +97,5 @@
</div>
<div id="triangle"></div>
</body></html>

View file

@ -7,7 +7,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<link href="reference/shape-outside-008-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="This test verifies that inline content only wraps around the
<meta content="This test verifies that inline content only wraps around the
shapes, and otherwise overlays the rest of the float margin
boxes when two floats are stacked next to each other." name="assert">
<!-- This test is derived from Example 5 in this version of the spec:
@ -95,7 +95,7 @@
The test passes if one green bar is inside the top rectangle, four green bars
are in the bottom rectangle, and none intersect the triangles. There should be no
red.
</p>
</p>
<div class="container" id="test">
<div class="test-float-left"></div>
XXXXXXXXXXXXXXXXX
@ -116,4 +116,5 @@
<div class="triangle" id="triangle-1"></div>
<div class="triangle" id="triangle-2"></div>
</body></html>
</body></html>

View file

@ -7,7 +7,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-circle" rel="help">
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<meta content="Valid circle position argument list are in the form of:
[ percentage|length left|center|right ]
[ percentage|length left|center|right ]
or [ percentage|length left|center|right ] [ percentage|length top|center|bottom ]
or [ left|center|right ]
or [ left|center|right top|center|bottom ]

View file

@ -33,7 +33,7 @@
{"name": "circle(closest-side farthest-side)"},
{"name": "circle(farthest-side closest-side)"}
];
generate_tests(ParsingUtils.testInlineStyle,
generate_tests(ParsingUtils.testInlineStyle,
ParsingUtils.buildTestCases(invalid_circle_radiii_tests) );
</script>

View file

@ -18,7 +18,7 @@
<script type="text/javascript">
var circle_position_calc_tests = [];
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['circle(at '+ value[0] +')',
testCase = ['circle(at '+ value[0] +')',
'circle(at '+ value[1] +' 50%)'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' && value[2].length == 2) {
testCase.push([ 'circle(at '+ value[2][0] +' 50%)',

View file

@ -9,7 +9,7 @@
<meta content="ahem" name="flags">
<meta content="The test verifies that text wraps around a
left float with a shape-outside defined as
a circle from the margin box and positioned
a circle from the margin box and positioned
in px units." name="assert">
<style>
body {

View file

@ -11,7 +11,7 @@
<meta content="ahem" name="flags">
<meta content="The test verifies that text wraps around a
left float with a shape-outside defined as
a circle with a farthest-side radius from the
a circle with a farthest-side radius from the
padding box with a shape-margin." name="assert">
<style>
body {

View file

@ -10,7 +10,7 @@
<meta content="ahem" name="flags">
<meta content="The test verifies that text wraps around a
right float with a shape-outside defined as
a circle positioned from the margin box with a
a circle positioned from the margin box with a
shape-margin." name="assert">
<style>
body {

View file

@ -11,7 +11,7 @@
<meta content="ahem" name="flags">
<meta content="The test verifies that text wraps around a
right float with a shape-outside defined as
a circle positioned from the border box with a
a circle positioned from the border box with a
shape-margin." name="assert">
<style>
body {

View file

@ -10,7 +10,7 @@
<meta content="ahem" name="flags">
<meta content="The test verifies that text wraps around a
right float with a shape-outside defined as
a circle positioned center right from the padding
a circle positioned center right from the padding
box with a shape-margin." name="assert">
<style>
body {

View file

@ -7,7 +7,7 @@
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-ellipse" rel="help">
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<meta content="Valid ellipse position argument list are in the form of:
[ percentage|length left|center|right ]
[ percentage|length left|center|right ]
or [ percentage|length left|center|right ] [ percentage|length top|center|bottom ]
or [ left|center|right ]
or [ left|center|right top|center|bottom ]

View file

@ -19,7 +19,7 @@
var ellipse_calc_tests = [];
var defaultPosition = ' at 50% 50%';
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse('+ value[0] +')',
testCase = ['ellipse('+ value[0] +')',
'ellipse('+ value[1] + defaultPosition +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' && value[2].length == 2) {
testCase.push([
@ -32,7 +32,7 @@
ellipse_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse(farthest-side '+ value[0] +')',
testCase = ['ellipse(farthest-side '+ value[0] +')',
'ellipse(farthest-side '+ value[1] + defaultPosition +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' && value[2].length == 2) {
testCase.push([
@ -45,7 +45,7 @@
ellipse_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse('+ value[0] +' '+ value[0] +')',
testCase = ['ellipse('+ value[0] +' '+ value[0] +')',
'ellipse('+ value[1] +' '+ value[1] + defaultPosition +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' && value[2].length == 2) {
testCase.push([

View file

@ -18,7 +18,7 @@
<script type="text/javascript">
var ellipse_position_calc_tests = [];
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse(at '+ value[0] +' 50%)',
testCase = ['ellipse(at '+ value[0] +' 50%)',
'ellipse(at '+ value[1] +' 50%)'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' && value[2].length == 2) {
testCase.push([
@ -44,7 +44,7 @@
ellipse_position_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse(closest-side farthest-side at '+ value[0] +' '+ value[0] +')',
testCase = ['ellipse(closest-side farthest-side at '+ value[0] +' '+ value[0] +')',
'ellipse(closest-side farthest-side at '+ value[1] +' '+ value[1] +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' && value[2].length == 2) {
testCase.push([

View file

@ -10,7 +10,7 @@
<meta content="ahem" name="flags">
<meta content="The test verifies that text wraps around a
left float with a shape-outside defined as an
ellipse with the radii explicitly set as closest-side
ellipse with the radii explicitly set as closest-side
from the padding box." name="assert">
<style>
body {

View file

@ -10,8 +10,8 @@
<meta content="ahem" name="flags">
<meta content="The test verifies that text wraps around a
right float with a shape-outside defined as
a ellipse with the radii in percentage units
positioned at center right from the margin box
a ellipse with the radii in percentage units
positioned at center right from the margin box
with a shape-margin." name="assert">
<style>
body {

View file

@ -6,7 +6,7 @@
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns"> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-inset" rel="help">
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<meta content="These tests verify that shape-outside inset() arguments can be numbers that are signed in
<meta content="These tests verify that shape-outside inset() arguments can be numbers that are signed in
positive and negative and/or decimal/non-decimal form." name="assert">
<meta content="dom" name="flags">
<script src="/resources/testharness.js"></script>

View file

@ -6,7 +6,7 @@
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns"> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-inset" rel="help">
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help">
<meta content="These tests verify that shape-outside inset() radial component can be numbers that are in
<meta content="These tests verify that shape-outside inset() radial component can be numbers that are in
signed positive and/or decimal/non-decimal form. Negative values are not allowed" name="assert">
<meta content="dom" name="flags">
<script src="/resources/testharness.js"></script>

View file

@ -7,7 +7,7 @@
<link href="reference/shape-outside-polygon-010-ref.htm" rel="match">
<meta content="ahem" name="flags">
<meta content="The test verifies that evenodd behaves the
same as nonzero for shape-outside and that text
same as nonzero for shape-outside and that text
will wraps around the outer edge of a polygon." name="assert">
<style>
body {
@ -56,4 +56,5 @@
<div class="ref-shape" id="ref-2"></div>
</body></html>