mirror of
https://github.com/servo/servo.git
synced 2025-08-03 20:50:07 +01:00
Update web-platform-tests to revision 58b72393db0bd273bb93268c33666cf893feb985
This commit is contained in:
Josh Matthews
parent
43a4f01647
commit
64e0a52537
12717 changed files with 59835 additions and 59820 deletions
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.flex {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
background-color: green;
|
||||
}
|
||||
.region {
|
||||
width: 100px;
|
||||
background-color: gray;
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a green square inside a gray square.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="region">
|
||||
<div class="flex">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.flex {
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 1em;
|
||||
color: green;
|
||||
}
|
||||
|
||||
.region {
|
||||
width: 100px;
|
||||
padding: 10px;
|
||||
background-color: gray;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a green square inside a gray rectangle.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="region">
|
||||
<div class="flex">
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.content {
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 1em;
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a green square.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="content">
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.blue {
|
||||
height: 60px;
|
||||
width: 100px;
|
||||
background-color: blue;
|
||||
}
|
||||
|
||||
.green {
|
||||
height: 40px;
|
||||
width: 100px;
|
||||
background-color: green;
|
||||
position: relative;
|
||||
bottom: 40px;
|
||||
left: 200px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a blue rectangle and a green rectangle, from left to right in this order.</li>
|
||||
<li>The blue rectangle one the left should be taller than the green rectangle on the right.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="blue"> </div>
|
||||
<div class="green"> </div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.content {
|
||||
font-family: Ahem;
|
||||
line-height: 1em;
|
||||
font-size: 20px;
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a horizontal green stripe.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="content">
|
||||
XXXXX<br>
|
||||
XXXXX
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.content {
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 1em;
|
||||
color: green;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see three horizontal green stripes.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="content">XXXX</div>
|
||||
<div class="content">XXXX</div>
|
||||
<div class="content">XXXX</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.c1, .c2 {
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 1em;
|
||||
}
|
||||
|
||||
.c1 {
|
||||
color: blue;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.c2 {
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a column of three horizontal stripes with colors in the following order:
|
||||
green, blue, green.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="c2">XXX</div>
|
||||
<div class="c1">XXX</div>
|
||||
<div class="c2">XXX</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.block {
|
||||
display: inline-block;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
height: 200px;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.blue {
|
||||
background-color: blue;
|
||||
}
|
||||
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.white {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you can see two squares placed on the same horizontal line. Each square consists of two
|
||||
vertical halves. The left square has the left half colored green and the right half colored blue.
|
||||
The right square has left half colored blue and the right half colored green.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="block green"></div><div class="block blue"></div><div class="block white"></div><div class="block blue"></div><div class="block green"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.block {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.blue {
|
||||
background-color: blue;
|
||||
}
|
||||
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you can see two squares: a green square at the top and a blue square at the bottom.</li>
|
||||
<li>The two squares should be of the same size.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="block green"></div>
|
||||
<div class="block blue"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.column {
|
||||
display: inline-block;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.green {
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.blue {
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
background-color: blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>The green and blue rectangles are regions placed inside a flexbox with column wrap flow.</li>
|
||||
<li>Test passes if you see two columns with a total of 6 alternating horizontal green and blue stripes.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="column">
|
||||
<div class="green"></div>
|
||||
<div class="blue"></div>
|
||||
<div class="green"></div>
|
||||
</div><div class="column">
|
||||
<div class="blue"></div>
|
||||
<div class="green"></div>
|
||||
<div class="blue"></div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.fixed {
|
||||
height: 40px;
|
||||
width: 100px;
|
||||
margin-bottom: 20px;
|
||||
background-color: green;
|
||||
position: relative;
|
||||
top: 60px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see two green stripes.</li>
|
||||
<li>You should not see any red.</li>
|
||||
</ul>
|
||||
<div class="fixed"></div>
|
||||
<div class="fixed"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.stripe {
|
||||
height: 20px;
|
||||
width: 80px;
|
||||
display: inline-block;
|
||||
margin-left: 30px;
|
||||
margin-right: 26px;
|
||||
margin-top: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see three horizontal green stripes.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="stripe"></div>
|
||||
<div class="stripe"></div>
|
||||
<div class="stripe"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.block {
|
||||
display: inline-block;
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.blue {
|
||||
background-color: blue;
|
||||
}
|
||||
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a rectangle having the left half colored green and the right half colored
|
||||
blue.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="block green"></div><div class="block blue"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.stripe {
|
||||
background-color: green;
|
||||
height: 20px;
|
||||
width: 80px;
|
||||
margin-top: 39px;
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see you three identical green stripes.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="stripe"></div>
|
||||
<div class="stripe"></div>
|
||||
<div class="stripe"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.stripe {
|
||||
background-color: green;
|
||||
height: 20px;
|
||||
width: 80px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see three horizontal green stripes.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="stripe"></div>
|
||||
<div class="stripe"></div>
|
||||
<div class="stripe"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.first, .second {
|
||||
width: 80px;
|
||||
background-color: green;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.first {
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.second {
|
||||
height: 35px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see two horizontal green stripes.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="first"></div>
|
||||
<div class="second"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.flex {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.region {
|
||||
height: 150px;
|
||||
width: 200px;
|
||||
background-color: gray;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a green square inside a gray rectangle.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="region">
|
||||
<div class="flex">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Regions: fixed sized region inside an auto height flexbox</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.content {
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 1em;
|
||||
color: green;
|
||||
}
|
||||
.region {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: red;
|
||||
}
|
||||
.flex {
|
||||
display: flex;
|
||||
width: 150px;
|
||||
background-color: gray;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a green square inside a gray rectangle.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="flex">
|
||||
<div class="region">
|
||||
<div class="content">
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX<br>
|
||||
XXXXX
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.stripe {
|
||||
height: 40px;
|
||||
width: 80px;
|
||||
margin-bottom: 20px;
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see two horizontal green stripes on the same horizontal line.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="stripe"></div>
|
||||
<div class="stripe"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Catalin Badea" href="mailto:badea@adobe.com">
|
||||
<style>
|
||||
.content {
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 1em;
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>Test passes if you see a single green stripe.</li>
|
||||
<li>You shouldn't see any red.</li>
|
||||
</ul>
|
||||
<div class="content">
|
||||
XXXXXXXXXX
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue