From 3e61a297aebd13681787fdad1f36747d3c4938a0 Mon Sep 17 00:00:00 2001
From: Andreas Kling <kling@serenityos.org>
Date: Thu, 6 Jul 2023 13:05:48 +0200
Subject: [PATCH] LibWeb: Allow font-family names to start with `-`

We achieve this by making properties that accept a custom-ident value
skip the "someone else's vendor prefix" check for values that start with
a `-` character.

This fixes an issue where e.g `font:family: Arial, -apple-system` would
be rejected by the parser completely. We now treat `-apple-system` like
an identifier in such cases.

Also add `valid-types` metadata for the `font-family` property so this
actually works. :^)
---
 .../Text/expected/css/font-family-with-dash-prefix.txt   | 1 +
 .../Text/input/css/font-family-with-dash-prefix.html     | 9 +++++++++
 Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp          | 3 ++-
 Userland/Libraries/LibWeb/CSS/Properties.json            | 6 +++++-
 4 files changed, 17 insertions(+), 2 deletions(-)
 create mode 100644 Tests/LibWeb/Text/expected/css/font-family-with-dash-prefix.txt
 create mode 100644 Tests/LibWeb/Text/input/css/font-family-with-dash-prefix.html

diff --git a/Tests/LibWeb/Text/expected/css/font-family-with-dash-prefix.txt b/Tests/LibWeb/Text/expected/css/font-family-with-dash-prefix.txt
new file mode 100644
index 000000000000000..4b5db0a8c2788ae
--- /dev/null
+++ b/Tests/LibWeb/Text/expected/css/font-family-with-dash-prefix.txt
@@ -0,0 +1 @@
+sans-serif
diff --git a/Tests/LibWeb/Text/input/css/font-family-with-dash-prefix.html b/Tests/LibWeb/Text/input/css/font-family-with-dash-prefix.html
new file mode 100644
index 000000000000000..84d10f3a1dc57bb
--- /dev/null
+++ b/Tests/LibWeb/Text/input/css/font-family-with-dash-prefix.html
@@ -0,0 +1,9 @@
+<script src="../include.js"></script>
+<script>
+    test(() => {
+        const e = document.createElement("div");
+        e.style.fontFamily = 'sans-serif';
+        e.style.fontFamily = 'serif, -apple-system';
+        println(e.style.fontFamily);
+    });
+</script>
diff --git a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
index 37bf764172096ce..92744672b0776a0 100644
--- a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
+++ b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
@@ -7928,6 +7928,7 @@ Parser::ParseErrorOr<NonnullRefPtr<StyleValue>> Parser::parse_css_value(Property
     m_context.set_current_property_id(property_id);
     Vector<ComponentValue> component_values;
     bool contains_var_or_attr = false;
+    bool const property_accepts_custom_ident = property_accepts_type(property_id, ValueType::CustomIdent);
 
     while (tokens.has_next_token()) {
         auto const& token = tokens.next_token();
@@ -7941,7 +7942,7 @@ Parser::ParseErrorOr<NonnullRefPtr<StyleValue>> Parser::parse_css_value(Property
             if (token.is(Token::Type::Whitespace))
                 continue;
 
-            if (token.is(Token::Type::Ident) && has_ignored_vendor_prefix(token.token().ident()))
+            if (!property_accepts_custom_ident && token.is(Token::Type::Ident) && has_ignored_vendor_prefix(token.token().ident()))
                 return ParseError::IncludesIgnoredVendorPrefix;
         }
 
diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json
index 931c19a7c65f78c..363a233352b25eb 100644
--- a/Userland/Libraries/LibWeb/CSS/Properties.json
+++ b/Userland/Libraries/LibWeb/CSS/Properties.json
@@ -851,7 +851,11 @@
   },
   "font-family": {
     "inherited": true,
-    "initial": "sans-serif"
+    "initial": "sans-serif",
+    "valid-types": [
+      "custom-ident",
+      "string"
+    ]
   },
   "font-size": {
     "inherited": true,