Source code
Revision control
Copy as Markdown
Other Tools
Test Info: Warnings
- This test has a WPT meta file that expects 1 subtest issues.
- This WPT test may be referenced by the following Test IDs:
- /css/css-view-transitions/scoped/scope-containment-keeps-author-remembered-size.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Scoped View Transition: the scope's last remembered size survives the transition</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
#scope {
width: 100px;
contain-intrinsic-size: auto 10px;
}
#scope.hidden { content-visibility: hidden; }
#child { height: 100px; }
</style>
</head>
<body>
<div id="scope"><div id="child"></div></div>
<script>
// Resolves one frame after the next resize observations were delivered, which
// is also when the last remembered size gets recorded.
function waitForResizeObservations(element) {
return new Promise(resolve => {
const observer = new ResizeObserver(() => {
observer.disconnect();
requestAnimationFrame(() => resolve());
});
observer.observe(element);
});
}
promise_test(async () => {
const scope = document.getElementById("scope");
// Record a last remembered size of 100px (the child's height).
await waitForResizeObservations(scope);
await scope.startViewTransition().finished;
await waitForResizeObservations(scope);
// Skipping its contents makes the scope use its last remembered size, which
// the view transition must not have discarded.
scope.classList.add("hidden");
assert_equals(scope.offsetHeight, 100);
}, "A scoped view transition doesn't discard the scope's last remembered size");
</script>
</body>
</html>