Implement handling of framework-handled key combinations

Author: gspencergoog

lib/web_ui/lib/src/engine/keyboard.dart

@@ -80,11 +80,6 @@ class Keyboard {
     }
 
     final html.KeyboardEvent keyboardEvent = event;
-
-    if (_shouldPreventDefault(event)) {
-      event.preventDefault();
-    }
-
     final String timerKey = keyboardEvent.code!;
 
     // Don't handle synthesizing a keyup event for modifier keys
@@ -132,16 +127,18 @@ class Keyboard {
     };
 
     EnginePlatformDispatcher.instance.invokeOnPlatformMessage('flutter/keyevent',
-        _messageCodec.encodeMessage(eventData), _noopCallback);
-  }
-
-  bool _shouldPreventDefault(html.KeyboardEvent event) {
-    switch (event.key) {
-      case 'Tab':
-        return true;
-      default:
-        return false;
-    }
+      _messageCodec.encodeMessage(eventData), (ByteData? data) {
+        if (data == null) {
+          return;
+        }
+        final String response = utf8.decode(data.buffer.asUint8List());
+        final Map<String, dynamic> jsonResponse = json.decode(response);
+        if (jsonResponse['handled'] as bool) {
+          // If the framework handled it, then don't propagate it any further.
+          event.preventDefault();
+        }
+      },
+    );
   }
 
   void _synthesizeKeyup(html.KeyboardEvent event) {

lib/web_ui/test/keyboard_test.dart

@@ -6,6 +6,7 @@
 import 'dart:html' as html;
 import 'dart:js_util' as js_util;
 import 'dart:typed_data';
+import 'dart:convert' hide Codec;
 
 import 'package:quiver/testing/async.dart';
 import 'package:test/bootstrap/browser.dart';
@@ -17,6 +18,14 @@ void main() {
   internalBootstrapBrowserTest(() => testMain);
 }
 
+ByteData _toByteData(List<int> bytes) {
+  final ByteData byteData = ByteData(bytes.length);
+  for (int i = 0; i < bytes.length; i++) {
+    byteData.setUint8(i, bytes[i]);
+  }
+  return byteData;
+}
+
 void testMain() {
   group('Keyboard', () {
     /// Used to save and restore [ui.window.onPlatformMessage] after each test.
@@ -226,13 +235,23 @@ void testMain() {
       expect(count, 2);
     });
 
-    test('prevents default when "Tab" is pressed', () {
+    test('prevents default when key is handled by the framework', () {
+      ByteData _toByteData(List<int> bytes) {
+        final ByteData byteData = ByteData(bytes.length);
+        for (int i = 0; i < bytes.length; i++) {
+          byteData.setUint8(i, bytes[i]);
+        }
+        return byteData;
+      }
+
       Keyboard.initialize();
 
       int count = 0;
       ui.window.onPlatformMessage = (String channel, ByteData data,
           ui.PlatformMessageResponseCallback callback) {
         count += 1;
+        ByteData response = _toByteData(utf8.encode(json.encode(<String, dynamic>{'handled': true})));
+        callback(response);
       };
 
       final html.KeyboardEvent event = dispatchKeyboardEvent(
@@ -247,6 +266,30 @@ void testMain() {
       Keyboard.instance.dispose();
     });
 
+    test("Doesn't prevent default when key is not handled by the framework", () {
+      Keyboard.initialize();
+
+      int count = 0;
+      ui.window.onPlatformMessage = (String channel, ByteData data,
+          ui.PlatformMessageResponseCallback callback) {
+        count += 1;
+        ByteData response = _toByteData(utf8.encode(json.encode(<String, dynamic>{'handled': false})));
+        callback(response);
+      };
+
+      final html.KeyboardEvent event = dispatchKeyboardEvent(
+        'keydown',
+        key: 'Tab',
+        code: 'Tab',
+      );
+
+      expect(event.defaultPrevented, isFalse);
+      expect(count, 1);
+
+      Keyboard.instance.dispose();
+    });
+
+
     test('keyboard events should be triggered on text fields', () {
       Keyboard.initialize();
 
@@ -278,6 +321,8 @@ void testMain() {
       ui.window.onPlatformMessage = (String channel, ByteData data,
           ui.PlatformMessageResponseCallback callback) {
         count += 1;
+        ByteData response = _toByteData(utf8.encode(json.encode(<String, dynamic>{'handled': true})));
+        callback(response);
       };
 
       useTextEditingElement((html.Element element) {