38 lines
1 KiB
HTML
38 lines
1 KiB
HTML
<!DOCTYPE html>
|
|
<title>View Transitions: @view-transition nested in a @layer rule.</title>
|
|
<link rel="help" href="https://drafts.csswg.org/css-view-transitions-2/">
|
|
<link rel="author" href="mailto:bokan@chromium.org">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<style>
|
|
@layer transition {
|
|
@view-transition {
|
|
navigation: auto;
|
|
}
|
|
}
|
|
</style>
|
|
<script>
|
|
const params = new URLSearchParams(location.search);
|
|
|
|
switch (params.get("mode") || "test") {
|
|
case "test":
|
|
promise_test(async t => {
|
|
const event = await new Promise(resolve => {
|
|
window.did_reveal = e => { resolve(e) };
|
|
const popup = window.open("?mode=old");
|
|
t.add_cleanup(() => popup.close());
|
|
});
|
|
|
|
assert_not_equals(event.viewTransition, null, "ViewTransition must be triggered.");
|
|
});
|
|
break;
|
|
case "old":
|
|
onload = () => requestAnimationFrame(() => requestAnimationFrame(() => {
|
|
location.replace('?mode=new');
|
|
}));
|
|
break;
|
|
case "new":
|
|
onpagereveal = e => window.opener.did_reveal(e);
|
|
break;
|
|
}
|
|
</script>
|