[Font] Fix "system-ui" font family within <canvas>

https://bugs.webkit.org/show_bug.cgi?id=263719 rdar://117231545 Reviewed by Tim Nguyen. The "system-ui" font family is expected down the line (in /platform code) to be a string like a user font and not the CSS prefixed keyword. * LayoutTests/fast/canvas/font-family-system-ui-canvas-expected-mismatch.html: Added. * LayoutTests/fast/canvas/font-family-system-ui-canvas.html: Added. * LayoutTests/platform/gtk/TestExpectations: * LayoutTests/platform/wpe/TestExpectations: * Source/WebCore/style/StyleResolveForFontRaw.cpp: (WebCore::Style::resolveForFontRaw): Canonical link: https://commits.webkit.org/269873@main
WebKit · Oct 27, 2023 · caa9d18 · caa9d18
1 parent dd5a348
commit caa9d18
Show file tree

Hide file tree

Showing 5 changed files with 27 additions and 3 deletions.
diff --git a/LayoutTests/fast/canvas/font-family-system-ui-canvas-expected-mismatch.html b/LayoutTests/fast/canvas/font-family-system-ui-canvas-expected-mismatch.html
@@ -0,0 +1,8 @@
+<canvas id="myCanvas" width="200" height="100"></canvas>
+
+<script>
+var c = document.getElementById("myCanvas");
+var ctx = c.getContext("2d");
+ctx.font = "30px serif";
+ctx.fillText("Hello World", 10, 50);
+</script>
diff --git a/LayoutTests/fast/canvas/font-family-system-ui-canvas.html b/LayoutTests/fast/canvas/font-family-system-ui-canvas.html
@@ -0,0 +1,8 @@
+<canvas id="myCanvas" width="200" height="100"></canvas>
+
+<script>
+var c = document.getElementById("myCanvas");
+var ctx = c.getContext("2d");
+ctx.font = "30px system-ui";
+ctx.fillText("Hello World", 10, 50);
+</script> 
diff --git a/LayoutTests/platform/gtk/TestExpectations b/LayoutTests/platform/gtk/TestExpectations
@@ -2654,4 +2654,6 @@ webkit.org/b/261024 webrtc/utf8-sdp.html [ Pass Timeout ]
 
 imported/w3c/web-platform-tests/css/filter-effects/backdrop-filter-plus-filter.html [ ImageOnlyFailure ]
 
+fast/canvas/font-family-system-ui-canvas.html [ Skip ]
+
 fast/line-grid [ Skip ]
diff --git a/LayoutTests/platform/wpe/TestExpectations b/LayoutTests/platform/wpe/TestExpectations
@@ -1676,4 +1676,6 @@ imported/w3c/web-platform-tests/css/filter-effects/svg-mutation-function-to-url.
 
 imported/w3c/web-platform-tests/css/filter-effects/backdrop-filter-plus-filter.html [ ImageOnlyFailure ]
 
+fast/canvas/font-family-system-ui-canvas.html [ Skip ]
+
 fast/line-grid [ Skip ]
diff --git a/Source/WebCore/style/StyleResolveForFontRaw.cpp b/Source/WebCore/style/StyleResolveForFontRaw.cpp
@@ -72,9 +72,13 @@ std::optional<FontCascade> resolveForFontRaw(const FontRaw& fontRaw, FontCascade
         bool isGenericFamily = false;
         switchOn(item, [&] (CSSValueID ident) {
             isGenericFamily = ident != CSSValueWebkitBody;
-            if (isGenericFamily)
-                family = familyNamesData->at(CSSPropertyParserHelpers::genericFontFamilyIndex(ident));
-            else
+            if (isGenericFamily) {
+                // FIXME: Treat system-ui like other generic font families
+                if (ident == CSSValueSystemUi)
+                    family = nameString(CSSValueSystemUi);
+                else
+                    family = familyNamesData->at(CSSPropertyParserHelpers::genericFontFamilyIndex(ident));
+            } else
                 family = AtomString(context.settingsValues().fontGenericFamilies.standardFontFamily());
         }, [&] (const AtomString& familyString) {
             family = familyString;