Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: set CombBox focusMode to BLUR when focus is outside of the component #989

Merged
merged 2 commits into from
Mar 5, 2021

Conversation

christopherhuii
Copy link
Contributor

Summary

In #901, we ensured that the combo box's focusMode was set to BLUR when a user clicked outside of the component. This is not sufficient for keyboard shortcuts, such as tabbing. When a user tabs through input fields, the focus on the combo box isn't reset.

*I also added an additional story that puts a text input next to the combo box to make it easier for folks to test. Since we've had some issues surrounding focus, I think it'd be good to have for testing.

Related Issues or PRs

#901
#902

How To Test

The form must have at least 2 elements to interact with. I used the combo box and a text input.

  1. Fill in the combo box (e.g. type value, select from dropdown, etc.)
  2. Use tab to focus the next field
  3. Type in the text field

Prior to the fix, the user's focus would be shifted back to the combo box.
After the fix, the user is able to continue typing in the text input

Copy link
Contributor

@haworku haworku left a comment

Choose a reason for hiding this comment

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

Thanks for the new storybook example - good pattern that we can use in other components too to improve testing. Glad we are making incremental a11y improvements.

@christopherhuii christopherhuii merged commit fa468a0 into main Mar 5, 2021
@christopherhuii christopherhuii deleted the ch-combobox-focus-blur branch March 5, 2021 20:24
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.

3 participants