Skip to content

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

Merged
snowystinger merged 1 commit into
adobe:mainfrom
Lucas20000903:fix/autocomplete-ime-composition-focus
Jun 9, 2026
Merged

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

Conversation

@Lucas20000903

Copy link
Copy Markdown
Contributor

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

@LFDanLu LFDanLu left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for fixing this!

@snowystinger snowystinger left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good, thanks for fixing this!

@snowystinger snowystinger added this pull request to the merge queue Jun 9, 2026
Merged via the queue into adobe:main with commit 474cdcc Jun 9, 2026
30 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

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)

3 participants