algolia / docsearch

:blue_book: The easiest way to add search to your documentation.
https://docsearch.algolia.com
MIT License
4.02k stars 390 forks source link

When selecting characters in Chinese and Japanese IME, the search function may be triggered incorrectly. #2111

Open PhantasWeng opened 1 year ago

PhantasWeng commented 1 year ago

Description

In Chinese and Japanese input methods, character selection is done using pinyin and enter key.

For example: to input "你" (ㄋ一ˇ), you would type ㄋ + ㄧ + ˇ + enter to select the character. Currently, pressing enter triggers an incorrect input.

This results in submitting ㄋ一ˇ instead of .

Steps to reproduce

  1. Go to DocSearchModal > input
  2. Keypress on ㄋ一ˇ enter (key mapping to su3 enter)
  3. Expected to be a character selection, but turned into link selection.

Google Chrome 個人資料  OwlPay Documentation 2023-10-31 at 13 22 48

Expected behavior

Expected to be a character selection on first enter keypress.

For example, in chrome url input Google Chrome When selecting characters in Chinese and Japanese IME the search function may be triggered incorrectly  · Issue #2111 · algoliadocsearch 2023-10-31 at 13 30 11

In github text area Google Chrome When selecting characters in Chinese and Japanese IME the search function may be triggered incorrectly  · Issue #2111 · algoliadocsearch 2023-10-31 at 13 31 12

Environment

PhantasWeng commented 7 months ago

Any suggestions?

randombeeper commented 4 months ago

@PhantasWeng sorry for the delayed response, I'm trying to clean up our issues now. Is this still an open topic? I would expect this to be a general issue with the Autocomplete UI and not limited to Docusaurus. May I ask you test the behavior on other DocSearch (Autocomplete UI) sites? See here for some featured partners: https://docsearch.algolia.com/. For example, neither Bootstrap nor Material use Docusaurus.

PhantasWeng commented 4 months ago

@randombeeper Yes, this issue still exists.

I encounter the same problem in different environments, which is why I am raising this issue here instead of on Docusaurus.

PhantasWeng commented 1 month ago

Hi @randombeeper,

Here is a reference regarding events related to non-Latin IME: Composition Event

For non-Latin IME, such as Chinese and Japanese, we typically use compositionstart and compositionend to determine input.

You can trigger the input change event using compositionend instead.

Could you let me know which file contains the program that triggers the event? I believe I could also contribute.

Jorrrmungandr commented 3 weeks ago

I also encountered the same problem in Vue.js doc. But it works fine in Docsearch doc. I guess this problem has been fixed in a recent release?

CritasWang commented 1 week ago

Hi @randombeeper,

Here is a reference regarding events related to non-Latin IME: Composition Event

For non-Latin IME, such as Chinese and Japanese, we typically use compositionstart and compositionend to determine input.

You can trigger the input change event using compositionend instead.

Could you let me know which file contains the program that triggers the event? I believe I could also contribute.

the input file is packages/docsearch-react/src/SearchBox.tsx

packages/docsearch-react/src/useDocSearchKeyboardEvents.ts I see that there is a check in this file to determine if input is in progress. Perhaps making changes here will have an effect

CritasWang commented 1 week ago

It seems to have been fixed in version 3.8

CritasWang commented 1 week ago

@algolia/autocomplete This component added processing for Composition in version 1.15.1, while the previous version of docsearch did not update dependencies. The 3.8 version has updated dependencies, and the Chinese and Japanese input experience is very good after the dependencies are updated image