LibWeb/CSS: Parse font-display descriptor

Author: https://github.com/AtkinsSJ
Commit: https://github.com/LadybirdBrowser/ladybird/commit/3eb6d510fd0
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/1554

Userland/Libraries/LibWeb/CSS/Enums.json

@@ -212,6 +212,13 @@
     "inline-start",
     "inline-end"
   ],
+  "font-display": [
+    "auto",
+    "block",
+    "swap",
+    "fallback",
+    "optional"
+  ],
   "font-variant": [
     "normal",
     "small-caps"

Userland/Libraries/LibWeb/CSS/FontFace.cpp

@@ -388,7 +388,7 @@ void FontFace::load_font_source()
             auto& style_computer = const_cast<StyleComputer&>(window.document()->style_computer());
 
             // FIXME: The ParsedFontFace is kind of expensive to create. We should be using a shared sub-object for the data
-            ParsedFontFace parsed_font_face { font->m_family, font->m_weight.to_number<int>(), 0 /* FIXME: slope */, font->m_urls, font->m_unicode_ranges, /* FIXME: ascent_override */ {}, /* FIXME: descent_override */ {}, /* FIXME: line_gap_override */ {} };
+            ParsedFontFace parsed_font_face { font->m_family, font->m_weight.to_number<int>(), 0 /* FIXME: slope */, font->m_urls, font->m_unicode_ranges, /* FIXME: ascent_override */ {}, /* FIXME: descent_override */ {}, /* FIXME: line_gap_override */ {}, /* FIXME: font_display */ FontDisplay::Auto };
             if (auto loader = style_computer.load_font_face(parsed_font_face, move(on_load), move(on_error)); loader.has_value())
                 loader->start_loading_next_url();
         } else {

Userland/Libraries/LibWeb/CSS/Keywords.json

@@ -149,6 +149,7 @@
   "expanded",
   "extra-condensed",
   "extra-expanded",
+  "fallback",
   "fantasy",
   "fast",
   "field",
@@ -268,6 +269,7 @@
   "open-quote",
   "optimizequality",
   "optimizespeed",
+  "optional",
   "outset",
   "outside",
   "overline",
@@ -351,6 +353,7 @@
   "subtractive",
   "super",
   "sw-resize",
+  "swap",
   "table",
   "table-caption",
   "table-cell",

Userland/Libraries/LibWeb/CSS/ParsedFontFace.cpp

@@ -9,7 +9,7 @@
 
 namespace Web::CSS {
 
-ParsedFontFace::ParsedFontFace(FlyString font_family, Optional<int> weight, Optional<int> slope, Vector<Source> sources, Vector<Gfx::UnicodeRange> unicode_ranges, Optional<Percentage> ascent_override, Optional<Percentage> descent_override, Optional<Percentage> line_gap_override)
+ParsedFontFace::ParsedFontFace(FlyString font_family, Optional<int> weight, Optional<int> slope, Vector<Source> sources, Vector<Gfx::UnicodeRange> unicode_ranges, Optional<Percentage> ascent_override, Optional<Percentage> descent_override, Optional<Percentage> line_gap_override, FontDisplay font_display)
     : m_font_family(move(font_family))
     , m_weight(weight)
     , m_slope(slope)
@@ -18,6 +18,7 @@ ParsedFontFace::ParsedFontFace(FlyString font_family, Optional<int> weight, Opti
     , m_ascent_override(move(ascent_override))
     , m_descent_override(move(descent_override))
     , m_line_gap_override(move(line_gap_override))
+    , m_font_display(font_display)
 {
 }
 

Userland/Libraries/LibWeb/CSS/ParsedFontFace.h

@@ -10,6 +10,7 @@
 #include <AK/FlyString.h>
 #include <LibGfx/Font/UnicodeRange.h>
 #include <LibURL/URL.h>
+#include <LibWeb/CSS/Enums.h>
 #include <LibWeb/CSS/Percentage.h>
 
 namespace Web::CSS {
@@ -22,11 +23,12 @@ public:
         Optional<FlyString> format;
     };
 
-    ParsedFontFace(FlyString font_family, Optional<int> weight, Optional<int> slope, Vector<Source> sources, Vector<Gfx::UnicodeRange> unicode_ranges, Optional<Percentage> ascent_override, Optional<Percentage> descent_override, Optional<Percentage> line_gap_override);
+    ParsedFontFace(FlyString font_family, Optional<int> weight, Optional<int> slope, Vector<Source> sources, Vector<Gfx::UnicodeRange> unicode_ranges, Optional<Percentage> ascent_override, Optional<Percentage> descent_override, Optional<Percentage> line_gap_override, FontDisplay font_display);
     ~ParsedFontFace() = default;
 
     Optional<Percentage> ascent_override() const { return m_ascent_override; }
     Optional<Percentage> descent_override() const { return m_descent_override; }
+    FontDisplay font_display() const { return m_font_display; }
     FlyString font_family() const { return m_font_family; }
     Optional<int> slope() const { return m_slope; }
     Optional<int> weight() const { return m_weight; }
@@ -43,6 +45,7 @@ private:
     Optional<Percentage> m_ascent_override;
     Optional<Percentage> m_descent_override;
     Optional<Percentage> m_line_gap_override;
+    FontDisplay m_font_display;
 };
 
 }

Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp

@@ -5458,6 +5458,7 @@ JS::GCPtr<CSSFontFaceRule> Parser::parse_font_face_rule(TokenStream<ComponentVal
     Optional<Percentage> ascent_override;
     Optional<Percentage> descent_override;
     Optional<Percentage> line_gap_override;
+    FontDisplay font_display = FontDisplay::Auto;
 
     // "normal" is returned as nullptr
     auto parse_as_percentage_or_normal = [&](Vector<ComponentValue> const& values) -> ErrorOr<Optional<Percentage>> {
@@ -5516,6 +5517,23 @@ JS::GCPtr<CSSFontFaceRule> Parser::parse_font_face_rule(TokenStream<ComponentVal
             }
             continue;
         }
+        if (declaration.name().equals_ignoring_ascii_case("font-display"sv)) {
+            TokenStream token_stream { declaration.values() };
+            if (auto keyword_value = parse_keyword_value(token_stream)) {
+                token_stream.skip_whitespace();
+                if (token_stream.has_next_token()) {
+                    dbgln_if(CSS_PARSER_DEBUG, "CSSParser: Unexpected trailing tokens in font-display");
+                } else {
+                    auto value = keyword_to_font_display(keyword_value->to_keyword());
+                    if (value.has_value()) {
+                        font_display = *value;
+                    } else {
+                        dbgln_if(CSS_PARSER_DEBUG, "CSSParser: `{}` is not a valid value for font-display", keyword_value->to_string());
+                    }
+                }
+            }
+            continue;
+        }
         if (declaration.name().equals_ignoring_ascii_case("font-family"sv)) {
             // FIXME: This is very similar to, but different from, the logic in parse_font_family_value().
             //        Ideally they could share code.
@@ -5612,7 +5630,7 @@ JS::GCPtr<CSSFontFaceRule> Parser::parse_font_face_rule(TokenStream<ComponentVal
         unicode_range.empend(0x0u, 0x10FFFFu);
     }
 
-    return CSSFontFaceRule::create(m_context.realm(), ParsedFontFace { font_family.release_value(), weight, slope, move(src), move(unicode_range), move(ascent_override), move(descent_override), move(line_gap_override) });
+    return CSSFontFaceRule::create(m_context.realm(), ParsedFontFace { font_family.release_value(), weight, slope, move(src), move(unicode_range), move(ascent_override), move(descent_override), move(line_gap_override), font_display });
 }
 
 Vector<ParsedFontFace::Source> Parser::parse_as_font_face_src()

Userland/Libraries/LibWeb/Dump.cpp

@@ -691,6 +691,9 @@ void dump_font_face_rule(StringBuilder& builder, CSS::CSSFontFaceRule const& rul
         indent(builder, indent_levels + 1);
         builder.appendff("line-gap-override: {}\n", font_face.line_gap_override().value());
     }
+
+    indent(builder, indent_levels + 1);
+    builder.appendff("display: {}\n", CSS::to_string(font_face.font_display()));
 }
 
 void dump_import_rule(StringBuilder& builder, CSS::CSSImportRule const& rule, int indent_levels)