mirror of
https://github.com/servo/servo.git
synced 2025-08-07 06:25:32 +01:00
Update web-platform-tests to revision b'99458bfd6e43f5842a4a510cc5adfd8185e5c64c'
This commit is contained in:
parent
eac515e4ab
commit
ec97b29ff1
334 changed files with 5735 additions and 3175 deletions
|
@ -5,7 +5,6 @@
|
|||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#last-remembered">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#intrinsic-size-override">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-2/#content-visibility">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-3/#containment-inline-size">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/7529">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/7516">
|
||||
<meta name="assert" content="Tests that the last remembered size is tracked independently for each axis." />
|
||||
|
@ -24,16 +23,9 @@
|
|||
width: 100px;
|
||||
height: 50px;
|
||||
}
|
||||
.content-150-75::before {
|
||||
width: 150px;
|
||||
height: 75px;
|
||||
}
|
||||
.content-skip {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
.contain-inline-size {
|
||||
contain: inline-size;
|
||||
}
|
||||
.ciw-auto-2 {
|
||||
contain-intrinsic-width: auto 2px;
|
||||
}
|
||||
|
@ -85,30 +77,4 @@ promise_test(async function() {
|
|||
target.className = "content-skip ciw-auto-2 cih-auto-1";
|
||||
checkSize(2, 50, "Using last remembered block size");
|
||||
}, "Only recording last remembered block size");
|
||||
|
||||
promise_test(async function() {
|
||||
target.className = "content-100-50";
|
||||
checkSize(100, 50, "Sizing normally");
|
||||
|
||||
await nextRendering();
|
||||
target.className = "content-100-50 ciw-auto-20 cih-auto-10 contain-inline-size";
|
||||
checkSize(20, 50, "Size containment for inline axis");
|
||||
|
||||
await nextRendering();
|
||||
target.className = "content-skip ciw-auto-2 cih-auto-1";
|
||||
checkSize(2, 50, "Using last remembered block size");
|
||||
}, "contain:inline-size prevents recording last remembered inline size");
|
||||
|
||||
promise_test(async function() {
|
||||
target.className = "content-100-50 ciw-auto-20 cih-auto-10";
|
||||
checkSize(100, 50, "Sizing normally");
|
||||
|
||||
await nextRendering();
|
||||
target.className = "content-150-75 ciw-auto-20 cih-auto-10 contain-inline-size";
|
||||
checkSize(20, 75, "Size containment for inline axis");
|
||||
|
||||
await nextRendering();
|
||||
target.className = "content-skip ciw-auto-2 cih-auto-1";
|
||||
checkSize(100, 75, "Using last remembered sizes from different times");
|
||||
}, "contain:inline-size can keep previous last remembered inline size");
|
||||
</script>
|
||||
|
|
|
@ -0,0 +1,94 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>Last remembered size</title>
|
||||
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#last-remembered">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#intrinsic-size-override">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-2/#content-visibility">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-3/#containment-inline-size">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/7807">
|
||||
<meta name="assert" content="Tests that the last remembered size can be updated when the element has size containment but doesn't skip its contents." />
|
||||
|
||||
<style>
|
||||
#target {
|
||||
width: max-content;
|
||||
height: max-content;
|
||||
border: 1px solid;
|
||||
}
|
||||
#target::before {
|
||||
content: "";
|
||||
display: block;
|
||||
}
|
||||
.content-100-50::before {
|
||||
width: 100px;
|
||||
height: 50px;
|
||||
}
|
||||
.content-skip {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
.contain-size {
|
||||
contain: size;
|
||||
}
|
||||
.contain-inline-size {
|
||||
contain: inline-size;
|
||||
}
|
||||
.ciw-auto-2 {
|
||||
contain-intrinsic-width: auto 2px;
|
||||
}
|
||||
.ciw-auto-20 {
|
||||
contain-intrinsic-width: auto 20px;
|
||||
}
|
||||
.cih-auto-1 {
|
||||
contain-intrinsic-height: auto 1px;
|
||||
}
|
||||
.cih-auto-10 {
|
||||
contain-intrinsic-height: auto 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="log"></div>
|
||||
|
||||
<div id="target"></div>
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script>
|
||||
const target = document.getElementById("target");
|
||||
|
||||
function checkSize(expectedWidth, expectedHeight, msg) {
|
||||
assert_equals(target.clientWidth, expectedWidth, msg + " - clientWidth");
|
||||
assert_equals(target.clientHeight, expectedHeight, msg + " - clientHeight");
|
||||
}
|
||||
|
||||
function nextRendering() {
|
||||
return new Promise(resolve => {
|
||||
requestAnimationFrame(() => requestAnimationFrame(() => resolve()));
|
||||
});
|
||||
}
|
||||
|
||||
promise_test(async function() {
|
||||
target.className = "content-100-50";
|
||||
checkSize(100, 50, "Sizing normally");
|
||||
|
||||
await nextRendering();
|
||||
target.className = "content-100-50 ciw-auto-20 cih-auto-10 contain-size";
|
||||
checkSize(20, 10, "Size containment");
|
||||
|
||||
await nextRendering();
|
||||
target.className = "content-skip ciw-auto-2 cih-auto-1";
|
||||
checkSize(20, 10, "Using last remembered size");
|
||||
}, "contain:size does not prevent recording last remembered size");
|
||||
|
||||
promise_test(async function() {
|
||||
target.className = "content-100-50";
|
||||
checkSize(100, 50, "Sizing normally");
|
||||
|
||||
await nextRendering();
|
||||
target.className = "content-100-50 ciw-auto-20 cih-auto-10 contain-inline-size";
|
||||
checkSize(20, 50, "Size containment for inline axis");
|
||||
|
||||
await nextRendering();
|
||||
target.className = "content-skip ciw-auto-2 cih-auto-1";
|
||||
checkSize(20, 50, "Using last remembered block size");
|
||||
}, "contain:inline-size does not prevent recording last remembered inline size");
|
||||
</script>
|
|
@ -0,0 +1,94 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>Last remembered size</title>
|
||||
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#last-remembered">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#intrinsic-size-override">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-2/#content-visibility">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/7807">
|
||||
<meta name="assert" content="Tests that content-visibility:auto, contain:size and contain-intrinsic-size:auto do not result in instable size." />
|
||||
|
||||
<style>
|
||||
#target {
|
||||
content-visibility: auto;
|
||||
contain-intrinsic-size: auto 100px auto 101px;
|
||||
width: max-content;
|
||||
height: max-content;
|
||||
border: 1px solid;
|
||||
}
|
||||
#target::before {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 50px;
|
||||
height: 51px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="log"></div>
|
||||
|
||||
<div id="spacer"></div>
|
||||
<div id="target"></div>
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script>
|
||||
const target = document.getElementById("target");
|
||||
const spacer = document.getElementById("spacer");
|
||||
|
||||
function checkSize(expectedWidth, expectedHeight, msg) {
|
||||
test(function() {
|
||||
assert_equals(target.clientWidth, expectedWidth, "clientWidth");
|
||||
assert_equals(target.clientHeight, expectedHeight, "clientHeight");
|
||||
}, msg);
|
||||
}
|
||||
|
||||
function nextRendering() {
|
||||
return new Promise(resolve => {
|
||||
requestAnimationFrame(() => requestAnimationFrame(() => resolve()));
|
||||
});
|
||||
}
|
||||
|
||||
setup({explicit_done: true});
|
||||
|
||||
(async function() {
|
||||
// Size normally.
|
||||
await nextRendering();
|
||||
checkSize(50, 51, "Sizing normally");
|
||||
await nextRendering();
|
||||
|
||||
// The last remembered size is 50x51, but the element is not skipping
|
||||
// its contents, so the fallback size will be used instead.
|
||||
target.style.contain = "size";
|
||||
checkSize(100, 101, "Sizing with c-i-s fallback");
|
||||
await nextRendering();
|
||||
|
||||
// The last remembered size is now 100x101, but still not using it.
|
||||
spacer.style.height = "10000vh";
|
||||
checkSize(100, 101, "Still sizing with c-i-s fallback");
|
||||
await nextRendering();
|
||||
|
||||
// The element went off-screen, using last remembered size now.
|
||||
// It's important that this is the same as in previous step!
|
||||
checkSize(100, 101, "Sizing with last remembered size");
|
||||
await nextRendering();
|
||||
|
||||
// Change the c-i-s fallback to prove last remembered size is used.
|
||||
target.style.containIntrinsicSize = "auto 150px auto 151px";
|
||||
checkSize(100, 101, "Still sizing with last remembered size");
|
||||
|
||||
// Move the element on-screen. Switch to using c-i-s fallback, and
|
||||
// update the last remembered size.
|
||||
spacer.style.height = "0px";
|
||||
await nextRendering();
|
||||
checkSize(150, 151, "Sizing with new c-i-s fallback");
|
||||
await nextRendering();
|
||||
|
||||
// Move off-screen again. Same size as in previous step!
|
||||
spacer.style.height = "10000vh";
|
||||
await nextRendering();
|
||||
target.style.containIntrinsicSize = "auto 200px auto 201px";
|
||||
checkSize(150, 151, "Sizing with new last remembered size");
|
||||
|
||||
done();
|
||||
})();
|
||||
</script>
|
Loading…
Add table
Add a link
Reference in a new issue