LibWeb: Invalidate layout on opacity change to/from zero

As of 7dc8062 paintables compute and cache their visibility (which
depends on opacity) at construction - this cached value can fall out of
sync with reality if if the opacity changes to/from zero within the
lifetime of that paintable.

This commit invalidates layout when an opacity changes to/from zero so
that we reconstruct paintables with the correct visibility.
This commit is contained in:
Callum Law 2025-08-18 17:15:58 +12:00 committed by Sam Atkins
parent 089f70a918
commit 3aff3327c4
3 changed files with 47 additions and 0 deletions

View File

@ -66,6 +66,12 @@ RequiredInvalidationAfterStyleChange compute_property_invalidation(CSS::Property
if (old_value_opacity != new_value_opacity && (old_value_opacity == 1 || new_value_opacity == 1)) {
invalidation.rebuild_stacking_context_tree = true;
}
// OPTIMIZATION: Paintables compute and store whether they are visible (which is dependent on whether opacity
// is equal to zero) on construction as a performance optimization - this means that if opacity
// changes to or from an opacity of zero we need to relayout to recompute paintable visibility.
if (old_value_opacity != new_value_opacity && (old_value_opacity == 0 || new_value_opacity == 0))
invalidation.relayout = true;
} else if (CSS::property_affects_stacking_context(property_id)) {
invalidation.rebuild_stacking_context_tree = true;
}

View File

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html>
<head>
<style>
#foo {
opacity: 0.5;
background-color: red;
height: 100px;
}
</style>
</head>
<body>
<div id="foo"></div>
</body>
</html>

View File

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html class="reftest-wait">
<head>
<link
rel="match"
href="../expected/paintable-visiblity-after-opacity-change-from-zero-ref.html"
/>
<style>
#foo {
opacity: 0;
background-color: red;
height: 100px;
}
</style>
</head>
<body>
<div id="foo"></div>
<script>
setTimeout(() => {
document.querySelector("#foo").style.opacity = 0.5;
document.documentElement.className = "";
}, 100);
</script>
</body>
</html>