LibWeb: Avoid resetting important flag when recomputing inherited style

Calme1709 · AtkinsSJ · commit 9de4e3a0eb9e · 2025-11-28T16:15:49.000Z
We were missing the important flag here so would always reset it to
false
diff --git a/Libraries/LibWeb/DOM/Element.cpp b/Libraries/LibWeb/DOM/Element.cpp
@@ -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);
             }
         }
diff --git a/Tests/LibWeb/Ref/expected/css/recomputing-inherited-style-doesnt-remove-important-ref.html b/Tests/LibWeb/Ref/expected/css/recomputing-inherited-style-doesnt-remove-important-ref.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<style>
+    #bar {
+        width: 1em !important;
+        background-color: green;
+        height: 1em;
+    }
+</style>
+<div id="bar"></div>
diff --git a/Tests/LibWeb/Ref/input/css/recomputing-inherited-style-doesnt-remove-important.html b/Tests/LibWeb/Ref/input/css/recomputing-inherited-style-doesnt-remove-important.html
@@ -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>

Original file line number	Diff line number	Diff line change
`@@ -850,8 +850,7 @@ CSS::RequiredInvalidationAfterStyleChange Element::recompute_inherited_style()`
`850`	`850`	`\|\| (property_id == CSS::PropertyID::FontWeight && first_is_one_of(preabsolutized_value->to_keyword(), CSS::Keyword::Bolder, CSS::Keyword::Lighter))`
`851`	`851`	`\|\| (property_id == CSS::PropertyID::FontSize && first_is_one_of(preabsolutized_value->to_keyword(), CSS::Keyword::Larger, CSS::Keyword::Smaller));`
`852`	`852`	`if (needs_updating) {`
`853`		`- auto is_inherited = computed_properties->is_property_inherited(property_id);`
`854`		`- computed_properties->set_property(property_id, *preabsolutized_value, is_inherited ? CSS::ComputedProperties::Inherited::Yes : CSS::ComputedProperties::Inherited::No);`
	`853`	`+ computed_properties->set_property_without_modifying_flags(property_id, *preabsolutized_value);`
`855`	`854`	`property_values_affected_by_inherited_style.set(i, old_value);`
`856`	`855`	`}`
`857`	`856`	`}`