From 5fe35fd41696b9ff6ff21876d98acab4d641eda3 Mon Sep 17 00:00:00 2001
From: Mouad Debbar <mouad.debbar@gmail.com>
Date: Tue, 3 Nov 2020 11:53:04 -0800
Subject: [PATCH] [web] Canoncalize font family on input fields (#22215)

---
 .../src/engine/text_editing/text_editing.dart |  6 +++--
 lib/web_ui/test/text_editing_test.dart        | 22 +++++++++++++++++++
 2 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/lib/web_ui/lib/src/engine/text_editing/text_editing.dart b/lib/web_ui/lib/src/engine/text_editing/text_editing.dart
index baa4b5e50..a6328706a 100644
--- a/lib/web_ui/lib/src/engine/text_editing/text_editing.dart
+++ b/lib/web_ui/lib/src/engine/text_editing/text_editing.dart
@@ -1363,7 +1363,8 @@ class TextEditingChannel {
         throw StateError(
             'Unsupported method call on the flutter/textinput channel: ${call.method}');
     }
-    EnginePlatformDispatcher.instance._replyToPlatformMessage(callback, codec.encodeSuccessEnvelope(true));
+    EnginePlatformDispatcher.instance
+        ._replyToPlatformMessage(callback, codec.encodeSuccessEnvelope(true));
   }
 
   /// Used for submitting the forms attached on the DOM.
@@ -1664,7 +1665,8 @@ class EditableTextStyle {
 
   String? get align => textAlignToCssValue(textAlign, textDirection);
 
-  String get cssFont => '${fontWeight} ${fontSize}px ${fontFamily}';
+  String get cssFont =>
+      '${fontWeight} ${fontSize}px ${canonicalizeFontFamily(fontFamily)}';
 
   void applyToDomElement(html.HtmlElement domElement) {
     domElement.style
diff --git a/lib/web_ui/test/text_editing_test.dart b/lib/web_ui/test/text_editing_test.dart
index c8efd8182..6bd51debe 100644
--- a/lib/web_ui/test/text_editing_test.dart
+++ b/lib/web_ui/test/text_editing_test.dart
@@ -1405,6 +1405,28 @@ void testMain() {
         // TODO(nurhan): https://github.com/flutter/flutter/issues/50590
         skip: browserEngine == BrowserEngine.webkit);
 
+    test('Canonicalizes font family', () {
+      showKeyboard();
+
+      final HtmlElement input = textEditing.editingElement.domElement;
+
+      MethodCall setStyle;
+
+      setStyle = configureSetStyleMethodCall(12, 'sans-serif', 4, 4, 1);
+      sendFrameworkMessage(codec.encodeMethodCall(setStyle));
+      expect(input.style.fontFamily, canonicalizeFontFamily('sans-serif'));
+
+      setStyle = configureSetStyleMethodCall(12, '.SF Pro Text', 4, 4, 1);
+      sendFrameworkMessage(codec.encodeMethodCall(setStyle));
+      expect(input.style.fontFamily, canonicalizeFontFamily('.SF Pro Text'));
+
+      setStyle = configureSetStyleMethodCall(12, 'foo bar baz', 4, 4, 1);
+      sendFrameworkMessage(codec.encodeMethodCall(setStyle));
+      expect(input.style.fontFamily, canonicalizeFontFamily('foo bar baz'));
+
+      hideKeyboard();
+    });
+
     test(
         'negative base offset and selection extent values in editing state is handled',
         () {
-- 
GitLab