Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-08 23:15:33 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update web-platform-tests to revision 58b72393db0bd273bb93268c33666cf893feb985

Browse source
This commit is contained in:
Josh Matthews 2017-10-31 08:58:31 -04:00
parent 43a4f01647
commit 64e0a52537
12717 changed files with 59835 additions and 59820 deletions
Download patch file Download diff file Expand all files Collapse all files

84
tests/wpt/web-platform-tests/css/css-shapes/spec-examples/reference/shape-outside-001-ref.html Normal file
View file

@ -0,0 +1,84 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Reference File</title>
<link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
<style type="text/css">
body {
margin-left: 0;
}
#container {
position: absolute;
top: 60px;
text-align: center;
font-family: Ahem;
font-size: 20px;
color: green;
line-height: 1em;
}
#level-1 {
width: 400px;
height: 80px;
}
#level-2 {
width: 200px;
height: 40px;
margin-left: 100px;
}
#level-3 {
width: 100px;
height: 40px;
margin-left: 150px;
}
#level-4 {
width: 50px;
height: 20px;
margin-left: 175px;
}
#level5 {
width: 400px;
height: 20px;
}
#left-triangle, #right-triangle {
position: absolute;
top: 60px;
width: 200px;
height: 200px;
background-color: lightblue;
}
#left-triangle {
clip-path: polygon(0 0, 200px 200px, 0 200px);
}
#right-triangle {
left: 200px;
clip-path: polygon(200px 0, 200px 200px, 0 200px);
}
</style>
</head>
<body>
<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>
<div id="container">
<div id="level-1">
XXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXX
</div>
<div id="level-2">
XXXXXXXXX XXXXXXX
</div>
<div id="level-3">
XXXXX XXX
</div>
<div id="level-4">
X
</div>
<br>
<div id="level-5">
XXXXXXXXXXXXXXXXX
</div>
</div>
<div id="left-triangle"></div>
<div id="right-triangle"></div>
</body>
</html>

44
tests/wpt/web-platform-tests/css/css-shapes/spec-examples/reference/shape-outside-004-ref.html Normal file
View file

@ -0,0 +1,44 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Reference File</title>
<link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
<style type="text/css">
#container {
position: absolute;
top: 70px;
width: 400px;
font-family: Ahem;
font-size: 20px;
line-height: 1.5em;
color: green;
}
#square{
position: absolute;
top: 70px;
width: 196px;
height: 196px;
border: 1px solid black;
z-index: 10;
}
</style>
</head>
<body>
<p>
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>
<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
</div>
<div id="square"></div>
</body>
</html>

57
tests/wpt/web-platform-tests/css/css-shapes/spec-examples/reference/shape-outside-006-ref.html Normal file
View file

@ -0,0 +1,57 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Reference File</title>
<link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
<style type="text/css">
#container {
position: absolute;
top: 70px;
width: 250px;
height: 105px;
border: 1px solid black;
}
.bar {
position: absolute;
height: 20px;
background-color: green;
}
#line-1 {
top: 10px;
left: 65px;
width: 160px;
}
#line-2 {
top: 40px;
left: 80px;
width: 140px;
}
#line-3 {
top: 70px;
left: 95px;
width: 120px;
}
#triangle {
position: absolute;
top: 70px;
width: 100px;
height: 100px;
background-color: lightblue;
clip-path: polygon(50px 0px, 100px 100px, 0px 100px);
}
</style>
</head>
<body>
<p>
The test passes if all there are three green horizontal bars to the right of the
triangle that are all inside the rectangle and there should be no green to the left
of the triangle. There should be no red.
</p>
<div id="container">
<div id="line-1" class="bar"></div>
<div id="line-2" class="bar"></div>
<div id="line-3" class="bar"></div>
</div>
<div id="triangle"></div>
</body>
</html>

72
tests/wpt/web-platform-tests/css/css-shapes/spec-examples/reference/shape-outside-007-ref.html Normal file
View file

@ -0,0 +1,72 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Reference File</title>
<link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
<style type="text/css">
#container {
position: absolute;
top: 70px;
width: 260px;
height: 120px;
font-family: Ahem;
font-size: 20px;
line-height: 1.5em;
border: 1px solid black;
padding-left: 2px;
}
#margin-line {
position: absolute;
top: 100px;
width: 263px;
border-bottom: 1px solid black;
}
.bar {
position: absolute;
height: 20px;
background-color: green;
}
#bar-1 {
top: 5px;
width: 240px;
}
#bar-2 {
top: 35px;
width: 240px;
}
#bar-3 {
top: 65px;
left: 22px;
width: 220px;
}
#bar-4 {
top: 95px;
left: 52px;
width: 200px;
}
#triangle {
position: absolute;
top: 90px;
width: 100px;
height: 100px;
background-color: lightblue;
margin-left: 2px;
clip-path: polygon(0% 50%, 50% 100%, 0 100%);;
}
</style>
</head>
<body>
<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>
<div id="container">
<div id="bar-1" class="bar"></div>
<div id="bar-2" class="bar"></div>
<div id="bar-3" class="bar"></div>
<div id="bar-4" class="bar"></div>
</div>
<div id="margin-line"></div>
<div id="triangle"></div>
</body>
</html>

89
tests/wpt/web-platform-tests/css/css-shapes/spec-examples/reference/shape-outside-008-ref.html Normal file
View file

@ -0,0 +1,89 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Reference File</title>
<link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
<style type="text/css">
#container {
position: absolute;
top: 70px;
width: 262px;
height: 150px;
border: 1px solid black;
}
#failure-container {
}
#margin-line {
position: absolute;
top: 100px;
width: 263px;
border-bottom: 1px solid black;
}
.fail {
position: absolute;
height: 15px;
background-color: green;
z-index: -1;
}
#bar-1 {
top: 7px;
left: 2px;
width: 255px;
}
#bar-2 {
top: 37px;
left: 2px;
width: 255px;
}
#bar-3 {
top: 67px;
left: 22px;
width: 225px;
}
#bar-4 {
top: 97px;
left: 122px;
width: 135px;
}
#bar-5 {
top: 127px;
left: 152px;
width: 105px;
}
.triangle {
position: absolute;
width: 100px;
height: 100px;
background-color: lightblue;
clip-path: polygon(0% 50%, 50% 100%, 0 100%);;
}
#triangle-1 {
top: 90px;
margin-left: 2px;
}
#triangle-2 {
top: 120px;
margin-left: 102px;
}
</style>
</head>
<body>
<p>
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>
<div id="container">
<div id="bar-1" class="fail"></div>
<div id="bar-2" class="fail"></div>
<div id="bar-3" class="fail"></div>
<div id="bar-4" class="fail"></div>
<div id="bar-5" class="fail"></div>
</div>
<div id="margin-line"></div>
<div id="triangle-1" class="triangle"></div>
<div id="triangle-2" class="triangle"></div>
</body>
</html>