mirror of
https://github.com/servo/servo.git
synced 2025-08-23 22:35:33 +01:00
Update web-platform-tests to revision 9c2bea6dac36e36ba1f489d10c2be42160d8f34f
This commit is contained in:
parent
482923cec2
commit
5c371dd958
459 changed files with 10717 additions and 834 deletions
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Containment Test: Layout containment supress baseline in flex items</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-1/#containment-layout">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#valdef-align-items-baseline">
|
||||
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
|
||||
<meta name=assert content="Flex items with layout containment are treated as having no baseline, for that reason their baseline is synthesized from the flex item's border box when they're baseline aligned.">
|
||||
<style>
|
||||
#flex {
|
||||
display: inline-flex;
|
||||
align-items: baseline;
|
||||
background: red;
|
||||
}
|
||||
|
||||
canvas {
|
||||
background: green;
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
#item {
|
||||
contain: layout;
|
||||
color: transparent;
|
||||
background: green;
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
<div id="flex">
|
||||
<canvas></canvas>
|
||||
<div id="item">item</div>
|
||||
</div>
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Containment Test: Layout containment supress baseline in grid items</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-1/#containment-layout">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#grid-baselines">
|
||||
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
|
||||
<meta name=assert content="Grid items with layout containment are treated as having no baseline, for that reason their baseline is synthesized from the grid item's border box when they're baseline aligned.">
|
||||
<style>
|
||||
#grid {
|
||||
display: inline-grid;
|
||||
align-items: baseline;
|
||||
background: red;
|
||||
grid-auto-flow: column;
|
||||
}
|
||||
|
||||
canvas {
|
||||
background: green;
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
#item {
|
||||
contain: layout;
|
||||
color: transparent;
|
||||
background: green;
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
<div id="grid">
|
||||
<canvas></canvas>
|
||||
<div id="item">item</div>
|
||||
</div>
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Containment Test: Layout containment supress baseline in table cells</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-1/#containment-layout">
|
||||
<link rel="match" href="reference/contain-layout-baseline-004-ref.html">
|
||||
<meta name=assert content="Table cells with layout containment are treated as having no baseline, for that reason their baseline is synthesized from the cell's border box when they're baseline aligned.">
|
||||
<style>
|
||||
#table {
|
||||
display: table;
|
||||
font: 100px/1 Ahem;
|
||||
}
|
||||
|
||||
#table > * {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
#first {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
#second {
|
||||
color: green;
|
||||
contain: layout;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if there is not a rectangle as the two boxes ("blue" and "green") are not baseline aligned.</p>
|
||||
<div id="table">
|
||||
<div id="first">X</div>
|
||||
<div id="second">X</div>
|
||||
</div>
|
|
@ -31,6 +31,7 @@
|
|||
{
|
||||
background-color: white;
|
||||
display: table-cell;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
div#contain
|
||||
|
|
|
@ -25,7 +25,7 @@
|
|||
{
|
||||
background-color: white;
|
||||
padding: 0px;
|
||||
vertical-align: baseline;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
td#contain
|
||||
|
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Containment Module Level 1: getComputedValue().contain</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#contain-property">
|
||||
<meta name="assert" content="contain computed value is as specified.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("contain", "none");
|
||||
test_computed_value("contain", "strict");
|
||||
test_computed_value("contain", "content");
|
||||
|
||||
test_computed_value("contain", "size");
|
||||
test_computed_value("contain", "layout");
|
||||
test_computed_value("contain", "style");
|
||||
test_computed_value("contain", "paint");
|
||||
test_computed_value("contain", "size layout");
|
||||
test_computed_value("contain", "style paint");
|
||||
test_computed_value("contain", "layout style paint");
|
||||
test_computed_value("contain", "size layout style paint");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Containment Module Level 1: parsing contain with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#contain-property">
|
||||
<meta name="assert" content="contain supports only the grammar 'none | strict | content | [ size || layout || style || paint ]'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_invalid_value("contain", "auto");
|
||||
test_invalid_value("contain", "strict content");
|
||||
test_invalid_value("contain", "size layout size");
|
||||
test_invalid_value("contain", "paint content");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Containment Module Level 1: parsing contain with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#contain-property">
|
||||
<meta name="assert" content="contain supports the full grammar 'none | strict | content | [ size || layout || style || paint ]'.">
|
||||
<meta name="assert" content="contain serializes in canonical order.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_valid_value("contain", "none");
|
||||
test_valid_value("contain", "strict");
|
||||
test_valid_value("contain", "content");
|
||||
|
||||
// [ size || layout || style || paint ]
|
||||
test_valid_value("contain", "size");
|
||||
test_valid_value("contain", "layout");
|
||||
test_valid_value("contain", "style");
|
||||
test_valid_value("contain", "paint");
|
||||
test_valid_value("contain", "layout size", "size layout");
|
||||
test_valid_value("contain", "paint style", "style paint");
|
||||
test_valid_value("contain", "layout style paint");
|
||||
test_valid_value("contain", "layout paint style size", "size layout style paint");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Containment Test: Reference file</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<style>
|
||||
div {
|
||||
display: inline-block;
|
||||
font: 100px/1 Ahem;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
#first {
|
||||
color: blue;
|
||||
position: relative;
|
||||
top: 20px;
|
||||
}
|
||||
#second {
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if there is not a rectangle as the two boxes ("blue" and "green") are not baseline aligned.</p>
|
||||
<div id="first">X</div><div id="second">X</div>
|
Loading…
Add table
Add a link
Reference in a new issue