[Windows Web] special characters needs to be pressed twice when entering text with Korean input method

[JE0903]

When I write Korean inside TextField widget on flutter web, space bar and other special characters like dot(.) doesn't appear right after Korean.

I have to put those things (space bar and special characters) twice to write what I intended to.

It works well with English but just not with Korean. With Flutter 2.0.6, It works well with Korean too, but the current version of Flutter 2.6.0-12.0.pre.535, the Korean input has this critical problem.

In addition, it works normally on MacBook, but does not work on Windows devices.

I would really appreciate it if you could give me a solution.

[maheshj01]

Hi @JE0903, thanks for filing the issue. I was able to replicate the issue on the stable channel, when entering a white space, special character (.?,/) or number with Korean keyboard enabled we have to press the keys twice. On the master channel, the cursor position seems to be broken with korean keyboard input, when entering text the cursor jumps in the middle of text.

stable

https://user-images.githubusercontent.com/31410839/139864828-39534b03-a9bb-41bd-b2d0-7bf831d417d4.mp4

master

https://user-images.githubusercontent.com/31410839/139864465-47d46e2c-50a9-4d72-85cc-8dc585acb4aa.mp4

code sample

```dart import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, ), home: const MiniKey(), ); } } class MiniKey extends StatefulWidget { const MiniKey({Key? key}) : super(key: key); @override State createState() => _MiniKeyState(); } class _MiniKeyState extends State { final TextEditingController controller = TextEditingController(); @override void dispose() { controller.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return Material( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ TextFormField( controller: controller, ), ], ), ); } } ```

flutter doctor -v

``` [√] Flutter (Channel stable, 2.5.3, on Microsoft Windows [Version 10.0.19042.1288], locale en-US) • Flutter version 2.5.3 at C:\flutter_sdk\stable • Upstream repository https://github.com/flutter/flutter.git • Framework revision 18116933e7 (3 weeks ago), 2021-10-15 10:46:35 -0700 • Engine revision d3ea636dc5 • Dart version 2.14.4 [√] Android toolchain - develop for Android devices (Android SDK version 31.0.0) • Android SDK at C:\Users\mahesh\AppData\Local\Android\sdk • Platform android-31, build-tools 31.0.0 • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189) • All Android licenses accepted. [√] Chrome - develop for the web • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe [√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.11.4) • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community • Visual Studio Community 2019 version 16.11.31727.386 • Windows 10 SDK version 10.0.19041.0 [√] Android Studio (version 2020.3) • Android Studio at C:\Program Files\Android\Android Studio • Flutter plugin can be installed from: https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189) [√] VS Code (version 1.61.2) • VS Code at C:\Users\mahesh\AppData\Local\Programs\Microsoft VS Code • Flutter extension version 3.28.0 [√] Connected device (3 available) • Windows (desktop) • windows • windows-x64 • Microsoft Windows [Version 10.0.19042.1288] • Chrome (web) • chrome • web-javascript • Google Chrome 95.0.4638.54 • Edge (web) • edge • web-javascript • Microsoft Edge 84.0.522.75 • No issues found! ``` ``` [√] Flutter (Channel master, 2.6.0-12.0.pre.555, on Microsoft Windows [Version 10.0.19042.1288], locale en-US) • Flutter version 2.6.0-12.0.pre.555 at C:\flutter_sdk\master • Upstream repository https://github.com/flutter/flutter.git • Framework revision 067386d706 (in the future), 2021-11-02 05:13:04 -0400 • Engine revision 76b4caeafe • Dart version 2.15.0 (build 2.15.0-268.0.dev) [√] Android toolchain - develop for Android devices (Android SDK version 31.0.0) • Android SDK at C:\Users\mahesh\AppData\Local\Android\sdk • Platform android-31, build-tools 31.0.0 • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189) • All Android licenses accepted. [√] Chrome - develop for the web • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe [√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.11.4) • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community • Visual Studio Community 2019 version 16.11.31727.386 • Windows 10 SDK version 10.0.19041.0 [√] Android Studio (version 2020.3) • Android Studio at C:\Program Files\Android\Android Studio • Flutter plugin can be installed from: https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189) [√] VS Code (version 1.61.2) • VS Code at C:\Users\mahesh\AppData\Local\Programs\Microsoft VS Code • Flutter extension version 3.28.0 [√] Connected device (3 available) • Windows (desktop) • windows • windows-x64 • Microsoft Windows [Version 10.0.19042.1288] • Chrome (web) • chrome • web-javascript • Google Chrome 95.0.4638.54 • Edge (web) • edge • web-javascript • Microsoft Edge 84.0.522.75 • No issues found! ```

cc: @justinmc

[dev-tryit]

I'm having the same thing happen.

[JE0903]

When can this be fixed? @maheshmnj

[maheshj01]

When can this be fixed? @maheshmnj

Hi @JE0903, I would advise you to please go through this wiki to understand how the bugs are prioritized https://github.com/flutter/flutter/wiki/Issue-hygiene#when-will-my-bug-be-fixed

[justinmc]

@cbracken Have you noticed anything like this before or does it sound related to any of the other input issues we're tracking on desktop?

Edit: Sorry I missed that this is web, probably not related.

[enfshin]

혹시 위 문제를 겪는 한국인이 있으시다면 아래 사이트가 도움되길 빕니다. 완벽한 해결은 아니고 억지로라도 인식하게끔 우회한 방식이라고 합니다. 개인 블로그

When can this be fixed? @maheshmnj I'm having the same thing happen.

translated using google translate

If there are any Koreans experiencing the above problem, I hope the site below will be helpful. It is not a perfect solution, but it is said that it is a way of circumventing it to recognize it even if it is forcibly. personal blog

When can this be fixed? @maheshmnj I'm having the same thing happen.

[JE0903]

It makes this exception.

======== Exception caught by services library ======================================================
Assertion failed: file:///C:/Users/Owner/Downloads/flutter/packages/flutter/lib/src/services/hardware_keyboard.dart:441:16
_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#b29c6(physicalKey: PhysicalKeyboardKey#7002c(usbHidUsage: \"0x0007002c\",
debugName: \"Space\"), logicalKey: LogicalKeyboardKey#00020(keyId: \"0x00000020\", keyLabel: \" \", debugName: \"Space\"), character: null, timeStamp: 0:01:41.732300, synthesized)"
====================================================================================================

[JE0903]

@enfshin

감사합니다. 해당 방식으로 어느정도 우회가 되긴 하는데 일부 글씨가 자음모음이 붙어서 써지지 않는 문제가 해결되지 않습니다.ㅠㅠ 혹시 방법 있으실까요??

translated using google translate

thank you. Although it is bypassed to some extent in this way, it does not solve the problem that some letters are not written with consonant vowels attached. ㅠㅠ Do you have a way?

[JE0903]

@enfshin 아 그리고 이게 저 익셉션 때문인지 릴리즈 모드에서는 저 우회하는 방식이 안먹네요.

translated using google translate

@enfshin Oh, and maybe it's because of that exception, that bypass method doesn't work in release mode.

[enfshin]

@JE0903 어떤 자음모음이 안 붙혀 써지나요?? 코드 내에서 자, 모음을 건드는 부분이 없는데 원래 사용안되는 자모음 조합아닌가요? 뱨, 떄 같이 실제로 없는 사용방식. 위에 익셉션에 대해서는 아는게 없습니다. 시뮬 키보드 설정 문제가 아닐까 싶네요

전 참고로 flutter 2.5.3 입니다. 이번 새 릴리즈는 한글과 기타 문제가 좀 있는거 같아서 업그레이드 하지 않았습니다.

translated using google translate

@JE0903 Which consonant vowels are not written together?? In the code, there is no part that touches the vowel. Is it not a consonant-vowel combination that is not used originally? does not really have a way of using it like a time. I don't know anything about exceptions above. I think it may be a problem with the simulation keyboard settings.

For reference, I am using flutter 2.5.3. I did not upgrade this new release because it seems that there are some problems with Hangul and other issues.

[JE0903]

@enfshin 특정 자, 모음이 안붙어써진다기 보다는 위에 캡처를 올려둔 것처럼 평소에 자주 사용하는 자, 모음이 쓸 때마다 각각 다른 타이밍에 저렇게 떨어져서 작성됩니다. [√] Flutter (Channel master, 2.6.0-12.0.pre.556, on Microsoft Windows [Version 10.0.19042.1415], locale ko-KR) 저는 불가피하게 한글이 잘 써지는 버전에서는 ios15이상 핸드폰에서 웹이 켜지지 않아 업데이트했습니다.

translated using google translate

@enfshin It is not that specific characters and vowels are not attached, but rather like the above capture, characters and vowels that are used frequently are written at different timings each time they are written. [√] Flutter (Channel master, 2.6.0-12.0.pre.556, on Microsoft Windows [Version 10.0.19042.1415], locale en-US) Inevitably, in the version where Korean is written well, the web did not turn on on ios15 or higher mobile phones, so I updated it.

[enfshin]

@JE0903 저는 불가피하게 한글이 잘 써지는 버전에서는 ios15이상 핸드폰에서 웹이 켜지지 않아 업데이트했습니다. 이게 무슨 말씀인지 이해는안되지만 버전이 달라서 완벽한 해결책을 드리긴 어려울거 같네요. 큰 이유가 없으면 다운그레이드 해보심은 어떠실까요.

제 코드 참고하셔서 비슷하게 만드시는게 좋을 듯합니다. 자모음이 떨어지는 현상은 아무래도 await Future.delayed(Duration(milliseconds: 10)); 때문일거 같습니다. 조정해보시면 될거 같습니다. 참고로 2.5.3버전 핸드폰에서는 한글이 문제없이 인식이 되니깐 platform 종류를 사전에 잡아서 코드를 web이나 window에서만 쓰시면 됩니다.

translated using google translate

@JE0903 Inevitably, in the version where Korean is written well, the web did not turn on on ios15 or higher mobile phones, so I updated it. I don't understand what you mean, but it seems difficult to give a perfect solution because the versions are different. If there is no major reason, how about downgrading?

It would be good to refer to my code and make it similar. The drop in consonants is probably due to await Future.delayed(Duration(milliseconds: 10));. You may need to adjust it. For reference, Korean is recognized without any problem in version 2.5.3 mobile phone, so you can select the platform type in advance and use the code only on the web or window.

[Taehyung93]

enfshin 님이 추천해주신 개인 블로그.

@enfshin 님이 추천해주신 위 링크로 들어가서 띄어쓰기등 고질적인 문제를 해결했습니다. 바로 사용할 수 있게 widget 화 한 코드 공유드리려고 합니다. 모두들 감사합니다.

import 'package:flutter/material.dart';

class HangulWebKeyboardSetting extends StatefulWidget {
  final TextEditingController controller;
  final Widget child;

  const HangulWebKeyboardSetting({
    Key? key,
    required this.controller,
    required this.child,
  }) : super(key: key);

  @override
  _HangulWebKeyboardSettingState createState() =>
      _HangulWebKeyboardSettingState();
}

class _HangulWebKeyboardSettingState extends State<HangulWebKeyboardSetting> {
  // ignore: constant_identifier_names
  static const List undetected_list = [
    " ",
    "`",
    "~",
    "!",
    "@",
    "#",
    "\$",
    "%",
    "^",
    "&",
    "*",
    "(",
    ")",
    "-",
    "_",
    "=",
    "+",
    "[",
    "]",
    "{",
    "}",
    "'",
    '"',
    ";",
    ":",
    "/",
    "?",
    ",",
    ".",
    "<",
    ">",
    "\\",
    "|",
    "1",
    "2",
    "3",
    "4",
    "5",
    "6",
    "7",
    "8",
    "9",
    "0"
  ];
  // ignore: constant_identifier_names
  static const List numberPad_list = [
    "Numpad Decimal",
    "Numpad Divide",
    "Numpad Multiply",
    "Numpad Subtract",
    "Numpad Add",
    "Numpad 0",
    "Numpad 1",
    "Numpad 2",
    "Numpad 3",
    "Numpad 4",
    "Numpad 5",
    "Numpad 6",
    "Numpad 7",
    "Numpad 8",
    "Numpad 9"
  ];
  // ignore: constant_identifier_names
  static const List numerPad_convert = [
    ".",
    "/",
    "*",
    "-",
    "+",
    "0",
    "1",
    "2",
    "3",
    "4",
    "5",
    "6",
    "7",
    "8",
    "9"
  ];

  @override
  Widget build(BuildContext context) {
    return RawKeyboardListener(
        focusNode: FocusNode(),
        onKey: (RawKeyEvent event) async {
          if (event.runtimeType.toString() == 'RawKeyDownEvent') {
            String keydownText = event.data.logicalKey.keyLabel;
            int cursorPosition = widget.controller.selection.baseOffset;
            if (numberPad_list.contains(keydownText)) {
              keydownText =
                  numerPad_convert[numberPad_list.indexOf(keydownText)];
            }
            if (undetected_list.contains(keydownText)) {
              await Future.delayed(const Duration(milliseconds: 10));
              // ignore: non_constant_identifier_names
              List text_list = widget.controller.text.split("");
              try {
                if (text_list[cursorPosition] != keydownText) {
                  text_list.insert(cursorPosition, keydownText);
                  widget.controller.text = text_list.join();
                  widget.controller.selection = TextSelection.fromPosition(
                      TextPosition(offset: cursorPosition + 1));
                }
              } catch (e) {
                if (text_list[widget.controller.text.length - 1] !=
                    keydownText) {
                  widget.controller.text =
                      widget.controller.text + keydownText;
                  widget.controller.selection = TextSelection.fromPosition(
                      TextPosition(offset: widget.controller.text.length));
                }
              }
            }
          }
        },
        child: widget.child);
  }
}

[cbracken]

Potentially related https://github.com/flutter/flutter/issues/96028

[cbracken]

/cc @dkwingsmt

[cbracken]

@JE0903 and others - are you still seeing this today? I work on the desktop embedders and am not familiar with the flutter web engine, but I notice that https://github.com/flutter/flutter/issues/103645, which I filed a while back was closed as fixed and I suspect it might have been the same bug.

[enfshin]

@JE0903 and others - are you still seeing this today? I work on the desktop embedders and am not familiar with the flutter web engine, but I notice that #103645, which I filed a while back was closed as fixed and I suspect it might have been the same bug.

I don't really tested this issue is still on going bug. I just use my code on every textinput in my flutter project.

[github-actions[bot]]

Without additional information, we are unfortunately not sure how to resolve this issue. We are therefore reluctantly going to close this bug for now. If you find this problem please file a new issue with the same description, what happens, logs and the output of 'flutter doctor -v'. All system setups can be slightly different so it's always better to open new issues and reference the related ones. Thanks for your contribution.

[github-actions[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.