[Web, keyboard] Locale layout mapping

lib/web_ui/lib/src/engine/embedder.dart

@@ -324,7 +324,7 @@ class FlutterViewEmbedder {
     }
 
     KeyboardBinding.initInstance();
-    PointerBinding.initInstance(glassPaneElement, KeyboardBinding.instance!.converter);
+    PointerBinding.initInstance(glassPaneElement, KeyboardBinding.instance.converter);
 
     if (domWindow.visualViewport == null && isWebKit) {
       // Older Safari versions sometimes give us bogus innerWidth/innerHeight

lib/web_ui/lib/src/engine/keyboard_binding.dart

@@ -4,6 +4,7 @@
 
 import 'package:meta/meta.dart';
 import 'package:ui/ui.dart' as ui;
+import 'package:web_locale_keymap/web_locale_keymap.dart' as keyboard_layouts;
 
 import '../engine.dart'  show registerHotRestartListener;
 import 'browser_detection.dart';
@@ -98,13 +99,28 @@ Duration _eventTimeStampToDuration(num milliseconds) {
   return Duration(milliseconds: ms, microseconds: micro);
 }
 
+// Returns a function that caches the result of `body`, ensuring that `body` is
+// only run once.
+ValueGetter<T> _cached<T>(ValueGetter<T> body) {
+  T? cache;
+  return () {
+    return cache ??= body();
+  };
+}
+
 class KeyboardBinding {
   KeyboardBinding._() {
-    _setup();
+    _addEventListener('keydown', allowInterop((DomEvent domEvent) {
+      final FlutterHtmlKeyboardEvent event = FlutterHtmlKeyboardEvent(domEvent as DomKeyboardEvent);
+      return _converter.handleEvent(event);
+    }));
+    _addEventListener('keyup', allowInterop((DomEvent event) {
+      return _converter.handleEvent(FlutterHtmlKeyboardEvent(event as DomKeyboardEvent));
+    }));
   }
 
   /// The singleton instance of this object.
-  static KeyboardBinding? get instance => _instance;
+  static KeyboardBinding get instance => _instance!;
   static KeyboardBinding? _instance;
 
   static void initInstance() {
@@ -117,8 +133,23 @@ class KeyboardBinding {
     }
   }
 
+  static void debugClearInstance() {
+    _instance = null;
+  }
+
+  /// The platform as used in the initialization.
+  ///
+  /// By default it is derived from [operatingSystem].
+  @protected
+  OperatingSystem get localPlatform {
+    return operatingSystem;
+  }
+
   KeyboardConverter get converter => _converter;
-  late final KeyboardConverter _converter;
+  late final KeyboardConverter _converter = KeyboardConverter(
+    _onKeyData,
+    localPlatform,
+  );
   final Map<String, DomEventListener> _listeners = <String, DomEventListener>{};
 
   void _addEventListener(String eventName, DomEventListener handler) {
@@ -154,16 +185,6 @@ class KeyboardBinding {
     return result!;
   }
 
-  void _setup() {
-    _addEventListener('keydown', allowInterop((DomEvent event) {
-      return _converter.handleEvent(FlutterHtmlKeyboardEvent(event as DomKeyboardEvent));
-    }));
-    _addEventListener('keyup', allowInterop((DomEvent event) {
-      return _converter.handleEvent(FlutterHtmlKeyboardEvent(event as DomKeyboardEvent));
-    }));
-    _converter = KeyboardConverter(_onKeyData, onMacOs: operatingSystem == OperatingSystem.macOs);
-  }
-
   void _reset() {
     _clearListeners();
     _converter.dispose();
@@ -210,10 +231,28 @@ class FlutterHtmlKeyboardEvent {
 // [dispatchKeyData] as given in the constructor. Some key data might be
 // dispatched asynchronously.
 class KeyboardConverter {
-  KeyboardConverter(this.performDispatchKeyData, {this.onMacOs = false});
+  KeyboardConverter(this.performDispatchKeyData, OperatingSystem platform)
+    : onMacOs = platform == OperatingSystem.macOs,
+      _mapping = _mappingFromPlatform(platform);
 
   final DispatchKeyData performDispatchKeyData;
+  // Whether the current platform is macOS, which affects how certain key events
+  // are comprehended.
   final bool onMacOs;
+  // Maps logical keys from key event properties.
+  final keyboard_layouts.LocaleKeymap _mapping;
+
+  static keyboard_layouts.LocaleKeymap _mappingFromPlatform(OperatingSystem platform) {
+    switch (platform) {
+      case OperatingSystem.iOs:
+      case OperatingSystem.macOs:
+        return keyboard_layouts.LocaleKeymap.darwin();
+      case OperatingSystem.windows:
+        return keyboard_layouts.LocaleKeymap.win();
+      default:
+        return keyboard_layouts.LocaleKeymap.linux();
+    }
+  }
 
   // The `performDispatchKeyData` wrapped with tracking logic.
   //
@@ -272,31 +311,16 @@ class KeyboardConverter {
            (metaDown ? _kDeadKeyMeta : 0);
   }
 
-  // Whether `event.key` should be considered a key name.
+  // Whether `event.key` is a key name, such as "Shift", or otherwise a
+  // character, such as "S" or "ж".
   //
-  // The `event.key` can either be a key name or the printable character. If the
-  // first character is an alphabet, it must be either 'A' to 'Z' ( and return
-  // true), or be a key name (and return false). Otherwise, return true.
+  // A key name always starts with a capitalized character, and has more than
+  // 1 letter.
   static bool _eventKeyIsKeyname(String key) {
     assert(key.isNotEmpty);
     return isAlphabet(key.codeUnitAt(0)) && key.length > 1;
   }
 
-  static int _characterToLogicalKey(String key) {
-    // Assume the length being <= 2 to be sufficient in all cases. If not,
-    // extend the algorithm.
-    assert(key.length <= 2);
-    int result = key.codeUnitAt(0) & 0xffff;
-    if (key.length == 2) {
-      result += key.codeUnitAt(1) << 16;
-    }
-    // Convert upper letters to lower letters
-    if (result >= _kCharUpperA && result <= _kCharUpperZ) {
-      result = result + _kCharLowerA - _kCharUpperA;
-    }
-    return result;
-  }
-
   static int _deadKeyToLogicalKey(int physicalKey, FlutterHtmlKeyboardEvent event) {
     // 'Dead' is used to represent dead keys, such as a diacritic to the
     // following base letter (such as Option-e results in ´).
@@ -306,10 +330,6 @@ class KeyboardConverter {
     return physicalKey + _getModifierMask(event) + _kWebKeyIdPlane;
   }
 
-  static int _otherLogicalKey(String key) {
-    return kWebToLogicalKey[key] ?? (key.hashCode + _kWebKeyIdPlane);
-  }
-
   // Map from pressed physical key to corresponding pressed logical key.
   //
   // Multiple physical keys can be mapped to the same logical key, usually due
@@ -369,21 +389,32 @@ class KeyboardConverter {
 
     final int physicalKey = _getPhysicalCode(event.code!);
     final bool logicalKeyIsCharacter = !_eventKeyIsKeyname(eventKey);
-    final String? character = logicalKeyIsCharacter ? eventKey : null;
-    final int logicalKey = () {
+    final ValueGetter<int> logicalKey = _cached<int>(() {
+      // Dead keys.
+      if (eventKey == _kLogicalDead) {
+        return _deadKeyToLogicalKey(physicalKey, event);
+      }
+      // Mapped logical keys, such as ArrowLeft, Escape, AudioVolumeDown.
+      final int? mappedLogicalKey = kWebToLogicalKey[eventKey];
+      if (mappedLogicalKey != null) {
+        return mappedLogicalKey;
+      }
+      // Keys with locations, such as modifier keys (Shift) or numpad keys.
       if (kWebLogicalLocationMap.containsKey(event.key)) {
         final int? result = kWebLogicalLocationMap[event.key!]?[event.location!];
         assert(result != null, 'Invalid modifier location: ${event.key}, ${event.location}');
         return result!;
       }
-      if (character != null) {
-        return _characterToLogicalKey(character);
-      }
-      if (eventKey == _kLogicalDead) {
-        return _deadKeyToLogicalKey(physicalKey, event);
+      // Locale-sensitive keys: letters, digits, and certain symbols.
+      if (logicalKeyIsCharacter) {
+        final int? localeLogicalKeys = _mapping.getLogicalKey(event.code, event.key, event.keyCode);
+        if (localeLogicalKeys != null) {
+          return localeLogicalKeys;
+        }
       }
-      return _otherLogicalKey(eventKey);
-    }();
+      // Minted logical keys.
+      return eventKey.hashCode + _kWebKeyIdPlane;
+    });
 
     assert(event.type == 'keydown' || event.type == 'keyup');
     final bool isPhysicalDown = event.type == 'keydown' ||
@@ -405,7 +436,7 @@ class KeyboardConverter {
           timeStamp: timeStamp,
           type: ui.KeyEventType.up,
           physical: physicalKey,
-          logical: logicalKey,
+          logical: logicalKey(),
           character: null,
           synthesized: true,
         ),
@@ -440,7 +471,7 @@ class KeyboardConverter {
             timeStamp: timeStamp,
             type: ui.KeyEventType.up,
             physical: physicalKey,
-            logical: logicalKey,
+            logical: logicalKey(),
             character: null,
             synthesized: true,
           ));
@@ -473,7 +504,7 @@ class KeyboardConverter {
     switch (type) {
       case ui.KeyEventType.down:
         assert(lastLogicalRecord == null);
-        nextLogicalRecord = logicalKey;
+        nextLogicalRecord = logicalKey();
         break;
       case ui.KeyEventType.up:
         assert(lastLogicalRecord != null);
@@ -498,7 +529,7 @@ class KeyboardConverter {
     _kLogicalKeyToModifierGetter.forEach((int testeeLogicalKey, _ModifierGetter getModifier) {
       // Do not synthesize for the key of the current event. The event is the
       // ground truth.
-      if (logicalKey == testeeLogicalKey) {
+      if (logicalKey() == testeeLogicalKey) {
         return;
       }
       if (_pressingRecords.containsValue(testeeLogicalKey) && !getModifier(event)) {
@@ -524,17 +555,18 @@ class KeyboardConverter {
     // Update key guards
     if (logicalKeyIsCharacter) {
       if (nextLogicalRecord != null) {
-        _startGuardingKey(physicalKey, logicalKey, timeStamp);
+        _startGuardingKey(physicalKey, logicalKey(), timeStamp);
       } else {
         _stopGuardingKey(physicalKey);
       }
     }
 
+    final String? character = logicalKeyIsCharacter ? eventKey : null;
     final ui.KeyData keyData = ui.KeyData(
       timeStamp: timeStamp,
       type: type,
       physical: physicalKey,
-      logical: lastLogicalRecord ?? logicalKey,
+      logical: lastLogicalRecord ?? logicalKey(),
       character: type == ui.KeyEventType.up ? null : character,
       synthesized: false,
     );

lib/web_ui/pubspec.yaml

@@ -8,6 +8,8 @@ environment:
 dependencies:
   js: 0.6.4
   meta: ^1.7.0
+  web_locale_keymap:
+    path: ../../third_party/web_locale_keymap
 
 dev_dependencies:
   archive: 3.1.2

lib/web_ui/test/engine/pointer_binding_test.dart

@@ -52,7 +52,7 @@ void testMain() {
     return KeyboardConverter((ui.KeyData key) {
       keyDataList.add(key);
       return true;
-    });
+    }, OperatingSystem.linux);
   }
 
   test('ios workaround', () {