From 531b92d467ff54511aa7070ccffb5f8c50ec65b6 Mon Sep 17 00:00:00 2001
From: Sam Atkins <sam@ladybird.org>
Date: Wed, 5 Feb 2025 15:48:12 +0000
Subject: [PATCH] LibWeb/CSS: Make `font` implicitly reset some properties

This is a weird behaviour specific to `font` - it can reset some
properties that it never actually sets. As such, it didn't seem worth
adding this concept to the code generator, but just manually stuffing
the ShorthandStyleValue with them during parsing.
---
 .../LibWeb/CSS/Parser/PropertyParsing.cpp     | 55 ++++++++++++++++++-
 .../css/font-implicitly-reset-properties.txt  | 13 +++++
 .../css/font-implicitly-reset-properties.html | 49 +++++++++++++++++
 3 files changed, 115 insertions(+), 2 deletions(-)
 create mode 100644 Tests/LibWeb/Text/expected/css/font-implicitly-reset-properties.txt
 create mode 100644 Tests/LibWeb/Text/input/css/font-implicitly-reset-properties.html

diff --git a/Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp b/Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp
index ed26cf21f67..b7e5f3f2701 100644
--- a/Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp
+++ b/Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp
@@ -2344,9 +2344,60 @@ RefPtr<CSSStyleValue> Parser::parse_font_value(TokenStream<ComponentValue>& toke
         line_height = property_initial_value(PropertyID::LineHeight);
 
     transaction.commit();
+    auto initial_value = CSSKeywordValue::create(Keyword::Initial);
     return ShorthandStyleValue::create(PropertyID::Font,
-        { PropertyID::FontStyle, PropertyID::FontVariant, PropertyID::FontWeight, PropertyID::FontWidth, PropertyID::FontSize, PropertyID::LineHeight, PropertyID::FontFamily },
-        { font_style.release_nonnull(), font_variant.release_nonnull(), font_weight.release_nonnull(), font_width.release_nonnull(), font_size.release_nonnull(), line_height.release_nonnull(), font_families.release_nonnull() });
+        {
+            // Set explicitly https://drafts.csswg.org/css-fonts/#set-explicitly
+            PropertyID::FontFamily,
+            PropertyID::FontSize,
+            PropertyID::FontWidth,
+            // FIXME: PropertyID::FontStretch
+            PropertyID::FontStyle,
+            PropertyID::FontVariant,
+            PropertyID::FontWeight,
+            PropertyID::LineHeight,
+
+            // Reset implicitly https://drafts.csswg.org/css-fonts/#reset-implicitly
+            PropertyID::FontFeatureSettings,
+            // FIXME: PropertyID::FontKerning,
+            PropertyID::FontLanguageOverride,
+            // FIXME: PropertyID::FontOpticalSizing,
+            // FIXME: PropertyID::FontSizeAdjust,
+            PropertyID::FontVariantAlternates,
+            PropertyID::FontVariantCaps,
+            PropertyID::FontVariantEastAsian,
+            PropertyID::FontVariantEmoji,
+            PropertyID::FontVariantLigatures,
+            PropertyID::FontVariantNumeric,
+            PropertyID::FontVariantPosition,
+            PropertyID::FontVariationSettings,
+        },
+        {
+            // Set explicitly
+            font_families.release_nonnull(),
+            font_size.release_nonnull(),
+            font_width.release_nonnull(),
+            // FIXME: font-stretch
+            font_style.release_nonnull(),
+            font_variant.release_nonnull(),
+            font_weight.release_nonnull(),
+            line_height.release_nonnull(),
+
+            // Reset implicitly
+            initial_value, // font-feature-settings
+                           // FIXME: font-kerning,
+            initial_value, // font-language-override
+                           // FIXME: font-optical-sizing,
+                           // FIXME: font-size-adjust,
+            initial_value, // font-variant-alternates
+            initial_value, // font-variant-caps
+            initial_value, // font-variant-east-asian
+            initial_value, // font-variant-emoji
+            initial_value, // font-variant-ligatures
+            initial_value, // font-variant-numeric
+            initial_value, // font-variant-position
+            initial_value, // font-variation-settings
+        });
 }
 
 RefPtr<CSSStyleValue> Parser::parse_font_family_value(TokenStream<ComponentValue>& tokens)
diff --git a/Tests/LibWeb/Text/expected/css/font-implicitly-reset-properties.txt b/Tests/LibWeb/Text/expected/css/font-implicitly-reset-properties.txt
new file mode 100644
index 00000000000..12432f14a27
--- /dev/null
+++ b/Tests/LibWeb/Text/expected/css/font-implicitly-reset-properties.txt
@@ -0,0 +1,13 @@
+font-feature-settings: normal
+font-kerning: undefined
+font-language-override: normal
+font-optical-sizing: undefined
+font-size-adjust: undefined
+font-variant-alternates: normal
+font-variant-caps: normal
+font-variant-east-asian: normal
+font-variant-emoji: normal
+font-variant-ligatures: normal
+font-variant-numeric: normal
+font-variant-position: normal
+font-variation-settings: normal
diff --git a/Tests/LibWeb/Text/input/css/font-implicitly-reset-properties.html b/Tests/LibWeb/Text/input/css/font-implicitly-reset-properties.html
new file mode 100644
index 00000000000..2e6e8b8ceb6
--- /dev/null
+++ b/Tests/LibWeb/Text/input/css/font-implicitly-reset-properties.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<style>
+    #target {
+
+        font-feature-settings: "sinf" 1;
+        font-kerning: none;
+        font-language-override: "NAH";
+        font-optical-sizing: none;
+        font-size-adjust: 42;
+        font-variant-alternates: historical-forms;
+        font-variant-caps: small-caps;
+        font-variant-east-asian: ruby;
+        font-variant-emoji: unicode;
+        font-variant-ligatures: contextual;
+        font-variant-numeric: tabular-nums;
+        font-variant-position: sub;
+        font-variation-settings: "wght" 700;
+
+        /* This should reset all of these */
+        font: 20px sans-serif;
+    }
+</style>
+<script src="../include.js"></script>
+<div id="target"></div>
+<script>
+    test(() => {
+        let target = document.getElementById("target");
+        let style = getComputedStyle(target);
+
+        let properties = [
+            "font-feature-settings",
+            "font-kerning",
+            "font-language-override",
+            "font-optical-sizing",
+            "font-size-adjust",
+            "font-variant-alternates",
+            "font-variant-caps",
+            "font-variant-east-asian",
+            "font-variant-emoji",
+            "font-variant-ligatures",
+            "font-variant-numeric",
+            "font-variant-position",
+            "font-variation-settings",
+        ];
+        for (let property of properties) {
+            println(`${property}: ${style[property]}`);
+        }
+    });
+</script>