Getting "Assertion failed:_pressedKeys.containsKey(event.physicalKey)" error in Flutter Web

Question

I fetched the data from an API through POST request. Then I populated the data inside a GridView Builder. But when I am scrolling the web version of the app it is giving me this error:

════════ Exception caught by services library ══════════════════════════════════
The following assertion was thrown during a platform message callback:
Assertion failed:
../…/services/hardware_keyboard.dart:441
_pressedKeys.containsKey(event.physicalKey)
"A KeyUpEvent is dispatched, but the state shows that the physical key is not pressed. If this occurs in real application, please report this bug to Flutter. If this occurs in unit tests, please ensure that simulated events follow Flutter's event model as documented in `HardwareKeyboard`. This was the event: KeyUpEvent#6f053(physicalKey: PhysicalKeyboardKey#700e3(usbHidUsage: \"0x000700e3\", debugName: \"Meta Left\"), logicalKey: LogicalKeyboardKey#4b191(keyId: \"0x200000106\", keyLabel: \"Meta Left\", debugName: \"Meta Left\"), character: null, timeStamp: 0:01:32.201000, synthesized)"


When the exception was thrown, this was the stack
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 251:49  throw_
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 29:3    assertFailed
packages/flutter/src/services/hardware_keyboard.dart 441:46                   <fn>
packages/flutter/src/services/hardware_keyboard.dart 451:14                   [_assertEventIsRegular]
packages/flutter/src/services/hardware_keyboard.dart 543:5                    handleKeyEvent
packages/flutter/src/services/hardware_keyboard.dart 821:57                   handleRawKeyMessage
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 84:54            runBody
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 123:5            _async
packages/flutter/src/services/hardware_keyboard.dart 808:51                   handleRawKeyMessage
packages/flutter/src/services/platform_channel.dart 73:49                     <fn>
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 84:54            runBody
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 123:5            _async
packages/flutter/src/services/platform_channel.dart 72:58                     <fn>
packages/flutter/src/services/binding.dart 379:35                             <fn>
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 84:54            runBody
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 123:5            _async
packages/flutter/src/services/binding.dart 376:98                             <fn>
lib/_engine/engine/platform_dispatcher.dart 1034:13                           invoke2
lib/ui/src/ui/channel_buffers.dart 25:5                                       invoke
lib/ui/src/ui/channel_buffers.dart 65:7                                       push
lib/ui/src/ui/channel_buffers.dart 130:16                                     push
lib/_engine/engine/platform_dispatcher.dart 302:25                            invokeOnPlatformMessage
lib/_engine/engine/keyboard.dart 130:39                                       [_handleHtmlEvent]
lib/_engine/engine/keyboard.dart 39:7                                         <fn>
════════════════════════════════════════════════════════════════════════════════

This is the code for populating the GridView. There isn't any error or issue with GridView. The data is being populated perfectly but as soon as I start scrolling, the above error shows in Debug console. Also, the scrolling is very laggy. It seems as if the animations are completely broken.

@override
  Widget build(BuildContext context) {
    return Container(
      child: Scaffold(
          body: Row(
        children: [
          SideDrawer(),
          Container(
            padding: EdgeInsets.all(20),
            width: MediaQuery.of(context).size.width * 0.77,
            child: FutureBuilder<dynamic>(
              future: appList(),
              builder: (context, snapshot) {
                if (snapshot.data == null) {
                  return Center(
                    child: CircularProgressIndicator(),
                  );
                } else {
                  return GridView.builder(
                    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                        crossAxisCount: 5,
                        childAspectRatio: 3 / 2,
                        crossAxisSpacing: 10,
                        mainAxisSpacing: 10),
                    itemCount: snapshot.data.length - 1,
                    itemBuilder: (context, index) {
                      return Card(
                        elevation: 2,
                        child: ListTile(
                          leading: Text(snapshot.data[index]["title"]),
                        ),
                      );
                    },
                  );
                }
              },
            ),
          ),
        ],
      )),
    );
  }

Any help will be appreciable. Thank you so much.

Anglican

Answer 1

This is an issue with hot reload: https://github.com/flutter/flutter/issues/87391. I experienced the same problem, but once I stop/relaunch the app, it disappears.

Chaste

yes the same happend to me on flutter 2.8 with web, the bug disappear when i relaunch the app – Raffia

Still happens in Flutter 3.16.5 with Desktop, and this is still the best and simple solution. Thanks, this saved me alot. – Orelle

Answer 2

If you are using a StatelessWidget, convert it to a StatefulWidget and do a full restart.

In the code example from the official Flutter API documentation for TextEditingController, they are using a StatefulWidget so it's safe to assume that TextEditingControllers need to be in a StatefulWidget.

Averil

While I agree that StatefulWidgets are just plain better because you can add/update functionality without having to refactor everything you've already done just to get to the point of having a good container, this advice goes against everything the Flutter team suggests is possible - even preferable - when using StatelessWidgets everywhere that dynamic state isn't 100% necessary. :( – Marieann

I updated my answer with a source - the official Flutter API documentation for TextEditingController has a code example and they are using a Stateful Widget. I don't believe you can use this with a Stateless widget. Also, I think you got Stateless mixed up with Stateful in your last statement. – Averil

I didn't confuse anything. I've used Stateless Widgets with text edit controllers pretty often. It's only been very recently I"ve started seeing this error - I think since I updated to Flutter 3 (I think, I won't swear to that). – Marieann

Answer 3

When you use a physical keyboard on an emulator rapidly, this error occurred. Use 'Hot Restart' or use Emulators/Simulators keyboard while testing the app.

Cicala

Answer 4

Add this two lines shrinkWrap: true and physics: ScrollPhysics(),under GridView.builder

return Scaffold(
      drawer: SideDrawer(),
        body: Container(
          padding: EdgeInsets.all(20),
          width: MediaQuery.of(context).size.width * 0.77,
          child: FutureBuilder<dynamic>(
            future: appList(),
            builder: (context, snapshot) {
              if (snapshot.data == null) {
                return Center(
                  child: CircularProgressIndicator(),
                );
              } else {
                return GridView.builder(
                  shrinkWrap: true,
                  physics: ScrollPhysics(),
                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 5,
                      childAspectRatio: 3 / 2,
                      crossAxisSpacing: 10,
                      mainAxisSpacing: 10),
                  itemCount: snapshot.data.length - 1,
                  itemBuilder: (context, index) {
                    return Card(
                      elevation: 2,
                      child: ListTile(
                        leading: Text(snapshot.data[index]["title"]),
                      ),
                    );
                  },
                );
              }
            },
          ),
        ),
     );

Wrack

For a moment I thought it fixed the issue but after some time it again gave the error. Well, it isn't affecting usage of the GridView but that error is annoying and shouldn't be there. Also, the lag is still there. – Anglican

if you got the error then you wrap your container with the SingleChildScrollView – Wrack

I guess it fixed the issue. Not sure. I will update if I still get the error. EDIT: Okay! So the issue is still there but it only happens when I press any key on keyboard. – Anglican

do you have any textfield ? – Wrack

Nope! Whatever I am showing on screen is in the code that I posted here. – Anglican

why you wrap with the container? – Wrack

Because I have a Sidebar in left side of the screen – Anglican

if you have drawer you can put it under scaffold not in row – Wrack

you add SideDrawer between scaffold and body drawer: SideDrawer() – Wrack

Well, I am not making a collapsible sidebar. I am making a sidebar that stick on side like any website has it. That's why I didn't add it into drawer of Scaffold – Anglican

Answer 5

you will not find this error in release mode, this is caused by the Emulator it self. You can ignore it!

Brae

Answer 6

This error also occurs when you use virtual emulators connected to your real device and you try to use physical keyboard as an input instead of Real device's keyboard

so try to input through the real device's input mode

Ciracirca

Answer 7

I had the same problem, and even reinstalling the app didn't work.

The problem was with my simulator (iPad). So I :

• Exited my simulator
• Launched the simulator again
• Reinstalled the app

And the problem disappeared.

Claudetta

Answer 8

I had a similar issue while developing flutter for desktop apps, I was getting the error due to having capslock on, ensure it is off, for somewierd reason, on an M2 chip Macbook, and you run the app on debug mode with capslock on, you get that error. Run the app with the caps off

Electrojet