mirror of
https://github.com/servo/servo.git
synced 2025-08-03 20:50:07 +01:00
Update web-platform-tests to revision 44702f2bc8ea98bc32b5b244f2fe63c6ce66d49d
This commit is contained in:
Josh Matthews
parent
85fa6409bb
commit
c227604a2c
997 changed files with 45660 additions and 14650 deletions
|
|
@ -34,7 +34,7 @@
|
|||
</style>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js">"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<body onload="checkLayout('.flexbox')">
|
||||
<div id=log></div>
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js">"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
|
||||
<style>
|
||||
.rect {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,64 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<title>CSS Flexbox: Resolving relative height content within a flex container against flexed size</title>
|
||||
<link rel="author" title="Microsoft" href="https://www.microsoft.com/" />
|
||||
<link rel="author" title="Greg Whitworth" href="gwhit@microsoft.com" />
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#definite-sizes" />
|
||||
<link rel="issue" href="https://github.com/w3c/csswg-drafts/issues/1679" />
|
||||
<meta name="assert" content="This test checks that percentage heights of content within a flex item are resolved against the flexed item" />
|
||||
|
||||
<style>
|
||||
.flexbox {
|
||||
display: flex;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.column {
|
||||
flex-flow: column;
|
||||
}
|
||||
|
||||
.column-wrap {
|
||||
flex-flow: column wrap;
|
||||
}
|
||||
|
||||
.flexbox > div {
|
||||
background: red;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
span {
|
||||
height: 100%;
|
||||
background: green;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<body onload="checkLayout('.flexbox')">
|
||||
<div id=log></div>
|
||||
|
||||
<p>You should see no red</p>
|
||||
|
||||
<!-- This wrapper div is solely here to setup the max height so it can be computed consistently since body at 100% won't be consistent across devices -->
|
||||
<div style="height: 100px;">
|
||||
|
||||
<div class="flexbox column">
|
||||
<div>
|
||||
<span data-expected-height="100"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="height: 100px;">
|
||||
<div class="flexbox column-wrap">
|
||||
<div>
|
||||
<span data-expected-height="50"></span>
|
||||
</div>
|
||||
<div>
|
||||
<span data-expected-height="50"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -80,7 +80,7 @@ body {
|
|||
</style>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js">"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<body onload="checkLayout('.flexbox')">
|
||||
<div id=log></div>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -67,7 +67,7 @@ body {
|
|||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js">"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
|
||||
<body onload="checkLayout('.flexbox')">
|
||||
<div id=log></div>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ padding in combination with abspos items">
|
|||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js">"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
|
||||
<body onload="checkLayout('.rect')">
|
||||
<div id=log></div>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ becomes absolutely positioned">
|
|||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js">"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
|
||||
<script>
|
||||
function update() {
|
||||
|
|
|
|||
|
|
@ -7,21 +7,21 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
position: relative;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
}
|
||||
span ~ span {
|
||||
margin: 2em 1em 1em;
|
||||
}
|
||||
span {
|
||||
display: block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
span ~ span {
|
||||
margin: 2em 1em 1em;
|
||||
}
|
||||
span {
|
||||
display: block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -7,21 +7,21 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
position: relative;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
}
|
||||
span ~ span {
|
||||
margin: 2em 1em 1em;
|
||||
}
|
||||
span {
|
||||
display: block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
span ~ span {
|
||||
margin: 2em 1em 1em;
|
||||
}
|
||||
span {
|
||||
display: block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -7,12 +7,12 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
.greenSquare {
|
||||
display: inline-block;
|
||||
margin-top: -200px;
|
||||
background: green;
|
||||
.greenSquare {
|
||||
display: inline-block;
|
||||
margin-top: -200px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -7,21 +7,21 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
width: 20em;
|
||||
height: 6.5em;
|
||||
position: relative;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
width: 20em;
|
||||
height: 6.5em;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
float: left;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
float: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -7,21 +7,21 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
width: 20em;
|
||||
height: 6.5em;
|
||||
position: relative;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
width: 20em;
|
||||
height: 6.5em;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
float: left;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
float: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -10,20 +10,20 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -10,20 +10,20 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -10,12 +10,12 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
.greenSquare {
|
||||
display: inline-flex;
|
||||
margin-top: -200px;
|
||||
background: green;
|
||||
.greenSquare {
|
||||
display: inline-flex;
|
||||
margin-top: -200px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -8,33 +8,33 @@
|
|||
<meta name="assert" content="Statement describing what the test case is asserting">
|
||||
<style type="text/css">
|
||||
.container {
|
||||
position: relative;
|
||||
height: 6em;
|
||||
display: flex;
|
||||
background: red;
|
||||
margin: 1em;
|
||||
border: 1px solid black;
|
||||
position: relative;
|
||||
height: 6em;
|
||||
display: flex;
|
||||
background: red;
|
||||
margin: 1em;
|
||||
border: 1px solid black;
|
||||
}
|
||||
span {
|
||||
height: 2em;
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
.first {
|
||||
order: 1;
|
||||
}
|
||||
.second {
|
||||
order: 2;
|
||||
}
|
||||
.third {
|
||||
order: 3;
|
||||
}
|
||||
.forth {
|
||||
order: 4;
|
||||
}
|
||||
span {
|
||||
height: 2em;
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
.first {
|
||||
order: 1;
|
||||
}
|
||||
.second {
|
||||
order: 2;
|
||||
}
|
||||
.third {
|
||||
order: 3;
|
||||
}
|
||||
.forth {
|
||||
order: 4;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -10,22 +10,22 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap-reverse;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
width: 20em;
|
||||
height: 6.5em;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap-reverse;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
width: 20em;
|
||||
height: 6.5em;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -10,22 +10,22 @@
|
|||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
.container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
width: 20em;
|
||||
height: 6.5em;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
background: red;
|
||||
margin: 1em 0;
|
||||
border: 1px solid black;
|
||||
width: 20em;
|
||||
height: 6.5em;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
background: green;
|
||||
color: white;
|
||||
margin: 1em;
|
||||
width: 8em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue