LibWeb: Be slightly better at @font-face rules with multiple sources

This patch improves @font-face loading when there are multiple src
values in two ways:

- Invalid/empty URLs are ignored
- Fonts with unsupported file extensions are ignored

This makes us load and display the emblem font on modern Reddit,
which is pretty neat! :^)

1 files changed, 22 insertions, 1 deletions

diff --git a/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp b/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp
index 4e8a121c46..0d50a3b51e 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp
@@ -1358,8 +1358,29 @@ void StyleComputer::load_fonts_from_sheet(CSSStyleSheet const& sheet)
         if (m_loaded_fonts.contains(font_face.font_family()))
             continue;
 
+        // NOTE: This is rather ad-hoc, we just look for the first valid
+        //       source URL that's either a WOFF or TTF file and try loading that.
+        // FIXME: Find out exactly which resources we need to load and how.
+        Optional<AK::URL> candidate_url;
+        for (auto& source : font_face.sources()) {
+            if (!source.url.is_valid())
+                continue;
+
+            auto path = source.url.path();
+            if (!path.ends_with(".woff"sv, AK::CaseSensitivity::CaseInsensitive)
+                || path.ends_with(".ttf"sv, AK::CaseSensitivity::CaseInsensitive)) {
+                continue;
+            }
+
+            candidate_url = source.url;
+            break;
+        }
+
+        if (!candidate_url.has_value())
+            continue;
+
         LoadRequest request;
-        auto url = m_document.parse_url(font_face.sources().first().url.to_string());
+        auto url = m_document.parse_url(candidate_url.value().to_string());
         auto loader = make<FontLoader>(const_cast<StyleComputer&>(*this), font_face.font_family(), move(url));
         const_cast<StyleComputer&>(*this).m_loaded_fonts.set(font_face.font_family(), move(loader));
     }