Skip to content

Conversation

@martenbjork
Copy link
Contributor

@martenbjork martenbjork commented Jul 22, 2022

Changes the event handler for the global search. It fixes a pesky focus bug, but makes the search feel a tiny bit less snappy which we can address later.

OK, I've narrow this one down to this:

  • When you press enter, the keydown event closes the modal and returns focus to the previously focused element (a11y best practice)
  • The onkeyup event immediately fires on that element causing the modal to re-open

You can prove this by manually setting the focus on the dark mode switcher, then opening the global search using the / key. When you press enter on a result, the search will disappear (onkeydown), focus will return to the dark mode switcher, and the site will switch to light/dark mode (onkeyup).

Fixes #6638

Copy link
Contributor

@SeanyB SeanyB left a comment

Choose a reason for hiding this comment

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

🎩 looks good! I see the problem no longer occurs when focus is on the search box.

@martenbjork martenbjork merged commit f4c6fdb into main Jul 22, 2022
@martenbjork martenbjork deleted the fix-globalsearch-dismiss-problem branch July 22, 2022 13:30
This was referenced Jul 22, 2022
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.

[polaris.shopify.com] Search box reappears after typing Enter to select a result

2 participants