Skip to content

fix(autocomplete): apply virtual focus to first item on IME composition input#10156

Open
Lucas20000903 wants to merge 1 commit into
adobe:mainfrom
Lucas20000903:fix/autocomplete-ime-composition-focus
Open

fix(autocomplete): apply virtual focus to first item on IME composition input#10156
Lucas20000903 wants to merge 1 commit into
adobe:mainfrom
Lucas20000903:fix/autocomplete-ime-composition-focus

Conversation

@Lucas20000903
Copy link
Copy Markdown

Closes #10126

When typing into an Autocomplete with an IME (CJK languages such as Korean / Japanese / Chinese), the first matching item was not getting virtual focus, so pressing Enter would not select it.

The root cause is in useAutocomplete's onChange: it only calls focusFirstItem() when lastInputType.current === 'insertText'. IME composition does not emit insertText — it emits insertCompositionText (while composing) and insertFromComposition (on commit). Those input types fell through to the else if branch and triggered clearVirtualFocus(true), removing focus entirely.

This PR extends the forward-typing condition to also recognize the IME composition input types so virtual focus on the first item behaves the same as Latin text input.

✅ Pull Request Checklist:

  • Included link to corresponding React Spectrum GitHub Issue.
  • Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • Filled out test instructions.
  • Updated documentation (if it already exists for this component).
  • Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

  1. Open an Autocomplete / ComboBox story (e.g. Autocomplete with a filterable ListBox).
  2. Switch your OS input to a CJK IME (Korean 2-set, Japanese, or Pinyin).
  3. Type a query that matches an item.
  4. Before: no item is virtually focused; pressing Enter selects nothing.
    After: the first matching item receives virtual focus and pressing Enter selects it — matching the existing Latin-input behavior.

🧢 Your Project:

Discovered while building an internal web app on top of react-aria Autocomplete (Korean IME).

…on input

useAutocomplete only called focusFirstItem() when inputType was
'insertText'. IME-based input (CJK languages) reports
'insertCompositionText'/'insertFromComposition' instead, which fell
through to clearVirtualFocus(true), so the first matching item never
received virtual focus and Enter could not select it.

Closes adobe#10126
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Autocomplete: first-item virtual focus not applied for IME composition input (CJK)

1 participant