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 tab and esc keys handling #1239

Merged
merged 3 commits into from
Dec 21, 2024
Merged

Fix tab and esc keys handling #1239

merged 3 commits into from
Dec 21, 2024

Conversation

zoglo
Copy link
Contributor

@zoglo zoglo commented Dec 20, 2024

Description

This PR fixes the weird behavior that people have when search has been disabled and you are trying to tab through.

Keys like tab for keyboard accessibility have not been taken into account at all, rendering keyboard navigation impossible in the current version. (Especially trying to navigate back as well when a search exists).

The dropdown stays open due to the following line not taking into account the typical behavior of Tab (focusing out) or Escape.
https://github.com/Choices-js/Choices/blob/a127f82755e85f326d929054359370a117fa173c/src/scripts/choices.ts#L1606-#L1623

Screenshots (if appropriate)

Types of changes

  • Chore (tooling change or documentation change)
  • Refactor (non-breaking change which maintains existing functionality)
  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)

Checklist

  • My code follows the code style of this project.
  • I have added new tests for the bug I fixed/the new feature I added.
  • I have modified existing tests for the bug I fixed/the new feature I added.
  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.

@Xon Xon added the bugfix Pull request that fixes an existing bug label Dec 21, 2024
@Xon Xon merged commit d659b75 into Choices-js:main Dec 21, 2024
10 checks passed
@zoglo zoglo deleted the fix/tab-focus branch December 21, 2024 23:18
@Xon
Copy link
Collaborator

Xon commented Dec 21, 2024

This sadly makes #1230 much more obvious the direction key handling is buggy :(

@zoglo
Copy link
Contributor Author

zoglo commented Dec 21, 2024

This sadly makes #1230 much more obvious the direction key handling is buggy :(

Hmm, you mean with shift + tab, right?
Should we open a new issue for that one, especially accessible wise?

There's a few more things I noticed but didn't have the time to find a proper solution for right now

@zoglo
Copy link
Contributor Author

zoglo commented Dec 21, 2024

We could continue this in the mentioned issue as well, especially since the handling could be improved upon and there's more to handle such as shift + tab at the same time not focusing into an existing serach - I noted it down

@Xon
Copy link
Collaborator

Xon commented Dec 22, 2024

A new issue to track it would be best

@Xon
Copy link
Collaborator

Xon commented Dec 22, 2024

@zoglo I've opened the #1242 which appears to fix #1230
Can you see if it fixes other issues you've observed around tab-handling?

@Xon Xon changed the title Consider tab and esc keys properly Fix tab and esc keys handling Dec 22, 2024
@zoglo
Copy link
Contributor Author

zoglo commented Dec 22, 2024

@zoglo I've opened the 1242 which appears to fix 1230 Can you see if it fixes other issues you've observed around tab-handling?

Will check tmrw after I wake up👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bugfix Pull request that fixes an existing bug
Projects
None yet
2 participants