Thanks to visit codestin.com
Credit goes to github.com

Skip to content

use default option in combobox #110

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.

Sign up for GitHub

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

Jump to bottom
Merged
merged 1 commit into from
Jul 4, 2023
Merged

use default option in combobox #110

merged 1 commit into from
Jul 4, 2023

Conversation

keithamus
Copy link
Contributor

In #51 we added data-autoselect which allows pressing Enter to commit the first result, if no others have been selected.

The problem is that with this option, it overrides the behaviour of the combobox events, which causes the first option to always be selected. https://github.com/github/accessibility-audits/issues/4434 has been raised around this issue.

Steps to reproduce:

  1. Visit https://github.github.com/auto-complete-element/examples/
  2. Focus the first input
  3. Type bender
  4. With the results displayed, key down until you have selected the bender option
  5. Press Enter

Expected result:

The input is now populated with @bender.

Actual result:

The input is populated with @hubot.

Solution

The solution is to use combox-nav's defaultFirstOption flag, and calling indicateFirstOption when the list is presented. This way combobox-nav is in charge of this behaviour, and not this element.

@keithamus keithamus requested a review from a team as a code owner May 31, 2023 14:44
@primer-css
Copy link

👋 Hello and thanks for pinging us! This issue or PR has been added to our inbox and a Design Infrastructure first responder will review it soon.

  • 🎨 If this is a PR that includes a visual change, please make sure to add screenshots in the description or deploy this code to a lab machine with instructions for how to test.
  • ⏩ If this is a PR that includes changes to an interaction, please include a video recording in the description.
  • ⚠️ If this is urgent, please visit us in #primer on Slack and tag the first responders listed in the channel topic.

siddharthkp
siddharthkp approved these changes Jun 1, 2023
View reviewed changes
Copy link
Contributor

@siddharthkp siddharthkp left a comment

Choose a reason for hiding this comment

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

👍 from primer-reviewers :)

@keithamus keithamus merged commit 68ff328 into main Jul 4, 2023
@keithamus keithamus deleted the use-default-option-in-combobox branch July 4, 2023 15:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@siddharthkp siddharthkp siddharthkp approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@keithamus @primer-css @siddharthkp