mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Update web-platform-tests to revision 82b73b315ce7ed1554e7a9b7bced66a5831e4ee5
This commit is contained in:
WPT Sync Bot
parent
00a9f30773
commit
76712d7d25
353 changed files with 6528 additions and 1307 deletions
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html class=reftest-wait>
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-children">
|
||||
<link rel="match" href="../green-square-ref.html">
|
||||
<meta name="assert" content="This test checks that absolute children don't appear in the children array." />
|
||||
|
||||
<style>
|
||||
.test {
|
||||
--child-expected: ["2"];
|
||||
|
||||
background: red;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.absolute {
|
||||
position: absolute;
|
||||
visibility: hidden;
|
||||
--child: 1;
|
||||
}
|
||||
|
||||
.inflow {
|
||||
visibility: hidden;
|
||||
--child: 2;
|
||||
}
|
||||
|
||||
@supports (display: layout(test)) {
|
||||
.test {
|
||||
background: green;
|
||||
display: layout(test);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/common/worklet-reftest.js"></script>
|
||||
|
||||
<div class="test">
|
||||
<div class="absolute"></div>
|
||||
<div class="inflow"></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet, {url: 'support/layout-child-worklet.js'});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html>
|
||||
<html class=reftest-wait>
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-children">
|
||||
<link rel="match" href="../green-square-ref.html">
|
||||
<meta name="assert" content="This test checks that boxes created by ::before/::after appear as children." />
|
||||
|
||||
<style>
|
||||
.test {
|
||||
--child-expected: ["1", "2", "3"];
|
||||
|
||||
background: red;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.test::before {
|
||||
visibility: hidden;
|
||||
content: 'before';
|
||||
--child: 1;
|
||||
}
|
||||
|
||||
.inflow {
|
||||
visibility: hidden;
|
||||
--child: 2;
|
||||
}
|
||||
|
||||
.test::after {
|
||||
visibility: hidden;
|
||||
content: 'after';
|
||||
--child: 3;
|
||||
}
|
||||
|
||||
@supports (display: layout(test)) {
|
||||
.test {
|
||||
background: green;
|
||||
display: layout(test);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/common/worklet-reftest.js"></script>
|
||||
|
||||
<div class="test">
|
||||
<div class="inflow"></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet, {url: 'support/layout-child-worklet.js'});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html class=reftest-wait>
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-children">
|
||||
<link rel="match" href="../green-square-ref.html">
|
||||
<meta name="assert" content="This test checks that fixed children don't appear in the children array." />
|
||||
|
||||
<style>
|
||||
.test {
|
||||
--child-expected: ["2"];
|
||||
|
||||
background: red;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.fixed {
|
||||
position: fixed;
|
||||
visibility: hidden;
|
||||
--child: 1;
|
||||
}
|
||||
|
||||
.inflow {
|
||||
visibility: hidden;
|
||||
--child: 2;
|
||||
}
|
||||
|
||||
@supports (display: layout(test)) {
|
||||
.test {
|
||||
background: green;
|
||||
display: layout(test);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/common/worklet-reftest.js"></script>
|
||||
|
||||
<div class="test">
|
||||
<div class="fixed"></div>
|
||||
<div class="inflow"></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet, {url: 'support/layout-child-worklet.js'});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html class=reftest-wait>
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-children">
|
||||
<link rel="match" href="../green-square-ref.html">
|
||||
<meta name="assert" content="This test checks that float children appear in the children array." />
|
||||
|
||||
<style>
|
||||
.test {
|
||||
--child-expected: ["1", "2"];
|
||||
|
||||
background: red;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.float {
|
||||
float: right;
|
||||
visibility: hidden;
|
||||
--child: 1;
|
||||
}
|
||||
|
||||
.inflow {
|
||||
visibility: hidden;
|
||||
--child: 2;
|
||||
}
|
||||
|
||||
@supports (display: layout(test)) {
|
||||
.test {
|
||||
background: green;
|
||||
display: layout(test);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/common/worklet-reftest.js"></script>
|
||||
|
||||
<div class="test">
|
||||
<div class="float"></div>
|
||||
<div class="inflow"></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet, {url: 'support/layout-child-worklet.js'});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
<!DOCTYPE html>
|
||||
<html class=reftest-wait>
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-children">
|
||||
<link rel="match" href="../green-square-ref.html">
|
||||
<meta name="assert" content="This test checks that regular inflow children appear as children." />
|
||||
|
||||
<style>
|
||||
.test {
|
||||
--child-expected: ["1", "2"];
|
||||
|
||||
background: red;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.inflow-1 {
|
||||
visibility: hidden;
|
||||
--child: 1;
|
||||
}
|
||||
|
||||
.inflow-2 {
|
||||
visibility: hidden;
|
||||
--child: 2;
|
||||
}
|
||||
|
||||
@supports (display: layout(test)) {
|
||||
.test {
|
||||
background: green;
|
||||
display: layout(test);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/common/worklet-reftest.js"></script>
|
||||
|
||||
<div class="test">
|
||||
<div class="inflow-1"></div>
|
||||
<div class="inflow-2"></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet, {url: 'support/layout-child-worklet.js'});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Layout API: Dynamic blockification of inline children</title>
|
||||
<link rel="author" href="mailto:obrufau@igalia.com" title="Oriol Brufau">
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-children" title="4.1. Layout Children">
|
||||
<meta name="assert" content="This test checks that inline children are correctly blockified or unblockified when the display of the parent changes dynamically." />
|
||||
|
||||
<style>
|
||||
#wrapper {
|
||||
display: layout(foo);
|
||||
}
|
||||
#test {
|
||||
display: inline;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="wrapper">
|
||||
<div id="test">Lorem ipsum</div>
|
||||
</div>
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/common/worklet-reftest.js"></script>
|
||||
<script>
|
||||
promise_test(async function() {
|
||||
await importWorklet(CSS.layoutWorklet, {url: 'support/layout-child-worklet.js'});
|
||||
|
||||
const wrapper = document.getElementById("wrapper");
|
||||
const test = document.getElementById("test");
|
||||
|
||||
assert_equals(getComputedStyle(test).display, "block", "The child should have been blockified by the custom layout");
|
||||
|
||||
wrapper.style.display = "block";
|
||||
assert_equals(getComputedStyle(test).display, "inline", "The child should no longer be blockified in block layout");
|
||||
|
||||
wrapper.style.display = "";
|
||||
assert_equals(getComputedStyle(test).display, "block", "The child should have been blockified again");
|
||||
});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE html>
|
||||
<html class=reftest-wait>
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-children">
|
||||
<link rel="match" href="../green-square-ref.html">
|
||||
<meta name="assert" content="This test checks that inline children are correctly blockified or wrapped in anonymous boxes." />
|
||||
|
||||
<style>
|
||||
/* We have a wrapper in this test to ensure that any text that is positioned
|
||||
* slightly outside the "test" box doesn't affect the rendering.
|
||||
* This wrapper has a 10px inline padding which does the trick. */
|
||||
.wrapper {
|
||||
background: green;
|
||||
padding: 0 10px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.test {
|
||||
--child-expected: ["1", "default", "3", "4", "5"];
|
||||
|
||||
background: red;
|
||||
color: green;
|
||||
width: 80px;
|
||||
--child: default;
|
||||
}
|
||||
|
||||
.inflow {
|
||||
visibility: hidden;
|
||||
--child: 3;
|
||||
}
|
||||
|
||||
@supports (display: layout(test)) {
|
||||
.test {
|
||||
background: green;
|
||||
display: layout(test);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/common/worklet-reftest.js"></script>
|
||||
|
||||
<div class="wrapper">
|
||||
<div class="test">
|
||||
<span style="--child: 1;">Text,</span> more text
|
||||
<div class="inflow"></div>
|
||||
<span style="--child: 4;">Text,
|
||||
<div>block!</div>
|
||||
</span>
|
||||
<span style="--child: 5;">Other text</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet, {url: 'support/layout-child-worklet.js'});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
import {areArraysEqual} from '/common/arrays.js';
|
||||
|
||||
registerLayout('test', class {
|
||||
static get inputProperties() {
|
||||
return [ '--child-expected'];
|
||||
}
|
||||
|
||||
static get childInputProperties() {
|
||||
return [ '--child' ];
|
||||
}
|
||||
|
||||
async intrinsicSizes() {}
|
||||
async layout(children, edges, constraints, styleMap) {
|
||||
const expected = JSON.parse(styleMap.get('--child-expected').toString());
|
||||
const actual = children.map((child) => {
|
||||
return child.styleMap.get('--child').toString().trim();
|
||||
});
|
||||
|
||||
const childFragments = await Promise.all(children.map(child => child.layoutNextFragment({})));
|
||||
|
||||
if (!areArraysEqual(expected, actual))
|
||||
return {autoBlockSize: 0, childFragments};
|
||||
|
||||
return {autoBlockSize: 100, childFragments};
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
<!DOCTYPE html>
|
||||
<html class=reftest-wait>
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-children">
|
||||
<link rel="match" href="../green-square-ref.html">
|
||||
<meta name="assert" content="This test checks that text children are correctly blockified." />
|
||||
|
||||
<style>
|
||||
/* We have a wrapper in this test to ensure that any text that is positioned
|
||||
* slightly outside the "test" box doesn't affect the rendering.
|
||||
* This wrapper has a 10px inline padding which does the trick. */
|
||||
.wrapper {
|
||||
background: green;
|
||||
padding: 0 10px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.test {
|
||||
--child-expected: ["default", "2", "default"];
|
||||
|
||||
background: red;
|
||||
color: green;
|
||||
width: 80px;
|
||||
--child: default;
|
||||
}
|
||||
|
||||
.inflow {
|
||||
visibility: hidden;
|
||||
--child: 2;
|
||||
}
|
||||
|
||||
@supports (display: layout(test)) {
|
||||
.test {
|
||||
background: green;
|
||||
display: layout(test);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/common/worklet-reftest.js"></script>
|
||||
|
||||
<div class="wrapper">
|
||||
<div class="test">
|
||||
Text text text
|
||||
<div class="inflow"></div>
|
||||
Text text text
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet, {url: 'support/layout-child-worklet.js'});
|
||||
</script>
|
||||
Loading…
Add table
Add a link
Reference in a new issue