Skip to content

Fix tab navigation on Google search forms

Sarah German requested to merge 1754-search-tab-nav-gps into main

What does this MR do and why?

When navigating the site with your keyboard, the search result/suggestion panel should close when you press Tab to navigate out of the search box. It currently does not do this. This MR fixes that.

Unchanged:

  • The up/down arrow keys continue to work for keyboard navigating through the result list.
  • Escape will close the result/suggestion panel.
  • Behavior for Lunr search (this was not an issue for those forms)

Closes #1754 (closed)

Screenshots, screen recordings, or links to review app

No visual changes.

How to validate

Numbered steps to set up and validate the change are strongly suggested.

  1. Visit the review app: https://1754-search-tab-nav-gps.docs.gitlab-review.app/
  2. Activate the search form by either clicking on it, using the / shortcut key, or using Tab to get there (this is unchanged, it does not matter how you activate the form)
  3. Press Tab
  4. The search panel should close, the modal overlay should close (interior pages only), and the next element on the page should become active/focused

Please test this on both:

Note that this fix is limited in scope to being able to "close" Search by tabbing out of it. There are other existing issues with keyboard nav, particularly on the global navigation (#978, #408).

Merge request acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Sarah German

Merge request reports