mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-09-22 01:08:56 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 10

LibWeb: Use correct style rule index in view transitions

Browse source 
This used to crash a lot of attempted view transitions, now it
doesn't anymore.
This commit is contained in:
Psychpsyo 2025-09-09 13:33:07 +02:00 • committed by Sam Atkins
commit 905e749575
Notes: github-actions[bot] 2025-09-09 11:51:16 +00:00
6 changed files with 101 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

2
Libraries/LibWeb/ViewTransition/ViewTransition.cpp
View file

@ -526,7 +526,7 @@ void ViewTransition::setup_transition_pseudo_elements()
transition_name, "transform", width, height, "backdrop_filter")),
stylesheet->rules().length()));
// FIXME: all the strings above should be the identically named variables, serialized somehow.
captured_element->group_keyframes = as<CSS::CSSKeyframesRule>(stylesheet->css_rules()->item(0));
captured_element->group_keyframes = as<CSS::CSSKeyframesRule>(stylesheet->css_rules()->item(index));
// 6. Set capturedElement’s group animation name rule to a new CSSStyleRule representing the
// following CSS, and append it to document’s dynamic view transition style sheet:

13
Tests/LibWeb/Crash/wpt-import/css/css-view-transitions/first-line-reparent-crash.html Normal file
View file

@ -0,0 +1,13 @@
<!doctype html>
<html class="test-wait">
<script>
window.addEventListener("load", () => {
const a = document.createElement("style")
document.documentElement.appendChild(a)
a.textContent = ":first-line{}"
document.adoptNode(document.body)
document.startViewTransition().ready.then(() => {
document.documentElement.className = "";
});
})
</script>

20
Tests/LibWeb/Crash/wpt-import/css/css-view-transitions/list-style-position-style-change-crash.html Normal file
View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html class="test-wait">
<title>View transitions: list-style-position crash</title>
<link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/">
<link rel="author" href="mailto:bokan@chromium.org">
<script>
onload = async () => {
let vt = document.startViewTransition();
await vt.ready;
await new Promise(resolve => requestAnimationFrame(resolve));
document.documentElement.style.listStylePosition = 'inside';
// Force style update.
window.scrollX;
document.documentElement.classList.remove('test-wait');
}
</script>
</html>

11
Tests/LibWeb/Crash/wpt-import/css/css-view-transitions/root-element-cv-hidden-crash.html Normal file
View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<title>View transitions: content-visibility:hidden on root element crash</title>
<link rel="help" href="https://crbug.com/1429947">
<style>
html {
content-visibility: hidden;
}
</style>
<script>
document.startViewTransition();
</script>

29
Tests/LibWeb/Crash/wpt-import/css/css-view-transitions/root-element-display-none-crash.html Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html class=test-wait>
<title>View transitions: html display none</title>
<link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/">
<link rel="author" href="mailto:vmpstr@chromium.org">
<style>
html {
display: none;
}
</style>
<script>
function finish() {
document.documentElement.removeAttribute("class");
}
async function runTest() {
if (!document.startViewTransition) {
document.body.textContent = "Precondition Failed: Missing document.startViewTransition";
finish();
return;
}
document.startViewTransition().finished.then(finish, finish);
}
onload = () => requestAnimationFrame(() => requestAnimationFrame(runTest));
</script>

27
Tests/LibWeb/Crash/wpt-import/css/css-view-transitions/root-element-display-none-during-transition-crash.html Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html class=test-wait>
<title>View transitions: entry animation from root display none</title>
<link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/">
<link rel="author" href="mailto:vmpstr@chromium.org">
<style>
.hidden {
display: none;
}
::view-transition-group(*) {
animation-duration: 500s
}
</style>
<script>
async function runTest() {
transition = document.startViewTransition();
transition.ready.then(() => {
requestAnimationFrame(() => {
document.documentElement.classList.toggle("hidden");
});
});
transition.finished.then(() => document.documentElement.classList.remove("test-wait"));
}
onload = () => requestAnimationFrame(() => requestAnimationFrame(runTest));
</script>