Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-12-07 21:59:54 +00:00
Code Issues Projects Releases Packages Wiki Activity

LibWeb: Avoid resetting important flag when recomputing inherited style

Browse source 
We were missing the important flag here so would always reset it to
false
This commit is contained in:
Callum Law 2025-11-15 00:48:15 +13:00 • committed by Sam Atkins
parent 9d2ecc069f
commit 9de4e3a0eb
Notes: github-actions[bot] 2025-11-28 16:17:27 +00:00
3 changed files with 38 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

3
Libraries/LibWeb/DOM/Element.cpp
View file

@ -850,8 +850,7 @@ CSS::RequiredInvalidationAfterStyleChange Element::recompute_inherited_style()
|| (property_id == CSS::PropertyID::FontWeight && first_is_one_of(preabsolutized_value->to_keyword(), CSS::Keyword::Bolder, CSS::Keyword::Lighter))
|| (property_id == CSS::PropertyID::FontSize && first_is_one_of(preabsolutized_value->to_keyword(), CSS::Keyword::Larger, CSS::Keyword::Smaller));
if (needs_updating) {
auto is_inherited = computed_properties->is_property_inherited(property_id);
computed_properties->set_property(property_id, *preabsolutized_value, is_inherited ? CSS::ComputedProperties::Inherited::Yes : CSS::ComputedProperties::Inherited::No);
computed_properties->set_property_without_modifying_flags(property_id, *preabsolutized_value);
property_values_affected_by_inherited_style.set(i, old_value);
}
}

9
Tests/LibWeb/Ref/expected/css/recomputing-inherited-style-doesnt-remove-important-ref.html Normal file
View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<style>
#bar {
width: 1em !important;
background-color: green;
height: 1em;
}
</style>
<div id="bar"></div>

28
Tests/LibWeb/Ref/input/css/recomputing-inherited-style-doesnt-remove-important.html Normal file
View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<link rel="match" href="../../expected/css/recomputing-inherited-style-doesnt-remove-important-ref.html" />
<style>
@keyframes fontSize {
from {
width: 5em;
}
to {
width: 5em;
}
}
#bar {
width: 1em !important;
animation: fontSize 1s infinite;
background-color: green;
height: 1em;
}
</style>
<div id="foo"><div id="bar"></div></div>
<script>
requestAnimationFrame(() => {
requestAnimationFrame(() => {
getComputedStyle(foo).fontSize;
foo.style.setProperty("color", "blue");
});
});
</script>