specify / specify7

Specify 7
https://www.specifysoftware.org/products/specify-7/
GNU General Public License v2.0
66 stars 36 forks source link

a11y: Move focus to main content after dialog closes #3908

Open maxpatiiuk opened 1 year ago

maxpatiiuk commented 1 year ago

If dialog opens a new page, after closing the dialog, the focus is moved back to the button that opened the dialog, rather than to the content of the newly opened page.

Example (all steps performed using keyboard):

  1. Go to the "Search" menu item and open it
  2. In the search dialog, enter query and hit enter
  3. The dialog closes, and the search results page is displayed. However, the focus is returned back to the "Search" menu item, rather than the page

Same happens in many other places: Trees dialog - select any tree - focus should be on the tree Queries dialog - select any query - focus should be in the query builder

Rather than trying to find every place where this issue could be happening, experiment with a solution that will fix all cases like this: i.e in react use effect listen for the following: if user was in overlay, and the URL changes so that user is no longer in an overlay, and new URL is not equal to URL user was on before overlay was open, then move focus to the first focusable element in the main content

emenslin commented 3 months ago

Can recreate in edge (7.9.6)