umbraco / Umbraco-CMS.Accessibility.Issues

6 stars 1 forks source link

Creating content - Modal - Closing returns focus to the top of the page #37

Open umbrabot opened 2 years ago

umbrabot commented 2 years ago

When making a selection from the component modal, focus returns to the top of the page

Steps to replicate:

  1. Navigate to content
  2. Create a component with any of the overlay options
  3. Close the modal
  4. Focus has returned to the top of the page (should return to previous position)

Issue: Closing content: Closing revealed content must return input focus to the component that revealed it

Why it matters: When a keyboard user dismisses revealed content (such as closing a menu or dialog), they expect focus to return to the trigger control that launched the content. Otherwise, they will have to explore the page content to re-orient themselves.

How to fix:

  1. Good: Ensure that the revealed content appears in the DOM immediately after the trigger component. When the user closes the revealed content, no element will have focus, but pressing Shift+Tab will move focus back to the trigger component.
  2. Better: When the user dismisses revealed content, move focus to the original trigger component. This is the ideal experience when the user cancels a dialog (dismisses it without taking any action).
  3. Best: When the user dismisses revealed content, move focus to the control that makes the most sense given the user's workflow.

W3 reference: https://www.w3.org/WAI/WCAG21/Understanding/focus-order.html