Vladimir Levin
44ae211fa7
Automatic update from web-platform-tests VT: Remap old child transform based on new parent transform. If we only have old snapshots, then we don't update the transforms in response to parent transform changing (in nested vt). This patch addresses the problem to make sure we do the remapping to preserve visual continuity if target transform changes. Bug: 443266269 R=skobes@chromium.org, kevers@chromium.org Change-Id: I59ab5db56c7f18f012905f7148cdcb568b46798c Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6917755 Reviewed-by: Steve Kobes <skobes@chromium.org> Commit-Queue: Vladimir Levin <vmpstr@chromium.org> Cr-Commit-Position: refs/heads/main@{#1511669} -- wpt-commits: 2df893cb2ad4a334eff041e5f8b9f6d01979251f wpt-pr: 54719
69 lines
1.3 KiB
HTML
69 lines
1.3 KiB
HTML
<!doctype html>
|
|
<html class=reftest-wait>
|
|
<title>Nested View Transitions: child only has old and parent changes transform</title>
|
|
<link rel="help" href="https://drafts.csswg.org/css-view-transitions-2/">
|
|
<link rel="match" href="green-rect-ref.html">
|
|
<script src="/common/reftest-wait.js"></script>
|
|
<script src="resources/compute-test.js"></script>
|
|
<script src="/dom/events/scrolling/scroll_support.js"></script>
|
|
|
|
<style>
|
|
:root { view-transition-name: none; }
|
|
|
|
.container {
|
|
width: 100px;
|
|
height: 100px;
|
|
position: relative;
|
|
background: red;
|
|
|
|
view-transition-name: container;
|
|
view-transition-group: contain;
|
|
}
|
|
|
|
.container.shifted {
|
|
top: 150px;
|
|
}
|
|
|
|
.contained {
|
|
width: 100px;
|
|
height: 100px;
|
|
background: green;
|
|
|
|
view-transition-name: contained;
|
|
}
|
|
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
|
|
::view-transition-group(*) {
|
|
animation-play-state: paused;
|
|
}
|
|
|
|
::view-transition-old(*) {
|
|
animation: unset;
|
|
opacity: 1;
|
|
}
|
|
|
|
::view-transition-new(*) {
|
|
animation: unset;
|
|
opacity: 0;
|
|
}
|
|
|
|
</style>
|
|
|
|
<div id=container class=container>
|
|
<div id=contained class=contained></div>
|
|
</div>
|
|
|
|
<script>
|
|
function runTest() {
|
|
document.startViewTransition(() => {
|
|
container.classList.add("shifted");
|
|
contained.classList.add("hidden");
|
|
}).ready.then(takeScreenshot);
|
|
}
|
|
|
|
onload = () => waitForCompositorReady().then(runTest);
|
|
</script>
|