Request for Fix: Misinterpretation of Enter Key during IME Input in df-messenger.js

[dott_Hagaji]

Dear All,

I hope you are all doing well. I am currently using df-messenger.js for a project and would like to bring up an issue regarding the handling of the Enter key during Japanese IME input. I would appreciate your help or any guidance on this matter.

Issue Details

• When the Enter key is pressed to confirm text input using the IME (Input Method Editor) for Japanese, it is mistakenly interpreted as the submission Enter key, causing the message to be sent prematurely.

• This results in messages being sent before the user has completed their input, which negatively impacts the user experience.

Expected Behavior

The IME confirmation Enter key should be ignored to prevent unintended message submissions. One potential solution is to detect the IME state using the keydown event and differentiate between the IME Enter key and the submission Enter key.

Request

It would be great if the community could consider fixing this issue or share any existing solutions or relevant documentation. Any help or advice you can provide would be greatly appreciated.

Thank you for your attention, and I look forward to your response.

Best regards,

[DamianS]

Hello @dott_Hagaji  ,Welcome on Google Cloud Community.

If you want to submit bug or feature request, you should use https://issuetracker.google.com/issues/new?component=187148&template=1161052 with proper subcategory. 

--
cheers,
Damian Sztankowski
LinkedIn medium.com Cloudskillsboost Sessionize Youtube

[cassandramae]

Hi @dott_Hagaji,

Sorry to hear that the behavior of enter key during IME Input is not working as expected in Dialogflow Messenger which can block your current progress. As what @DamianS mentioned, you may file this using our issue tracker so our engineering team can look into this. Before filing, please take note on what to expect when opening an issue.

On the other hand, you may consider implementing this approach that may help you with this issue.

• Using true or false boolean, you may track the user if it's currently in the middle of composing a message. It's initially set to false since the user starts with an empty input field. For example,

dfMessenger.addEventListener('typingStart', () => {
isTyping = true; //user starts composing a message in the chat input field
});
dfMessenger.addEventListener('typingEnd', () => {
isTyping = false; //user finishes composing a message (e.g., stops typing)
});

• Then handle the user input when user submits their reply. For example,

  dfMessenger.addEventListener('df-user-input-entered', function (event) {
    if (isTyping) { 
      // Cancel sending if converting
      event.preventDefault();
    } else {
      // code to send the user's message
    }
  });​

  where event.preventDefault() prevents the message from being sent to the Dialogflow agent.

Hope this helps.