search

semrush / intergalactic

Intergalactic Design System is a constantly developing design system and library of React components.
https://developer.semrush.com/intergalactic/
MIT License
144 stars 54 forks source link

Data summary pop-up - 'Close' link is skipped when user switches focus insight the pop-up #721

Closed mihalichzh closed 1 year ago

mihalichzh commented 1 year ago

Describe the bug When interacting with data summary pop-up for charts, user is not able to place focus on 'Close' link

To Reproduce

  1. Open data summary pop-up for any supported chart (e.g. Donut chart can be used)
  2. Open the data summary pop-up using keyboard
  3. Attempt to place focus on 'Close' link

Expected behavior 'Close' link can be focused (and it is expected to be first focusable element inside the pop-up)

Actual behavior 'Close' link is not available for focusing using keyboard (hence it cannot be pushed by the user). So currently user has to focus through the pop-up completely to close it (see att. screen cast).

https://github.com/semrush/intergalactic/assets/39348763/9571b81d-4152-402c-888e-a60ead2dd29f

msereniti commented 1 year ago

It is an intended behavior.

THe "Close" interactive element is made specially for mouse users only. With mouse it's almost impossible to open the charts a11y module, so, if such user accidentally opens it, they see mouse intractable element to close it.

For keyboard users interaction with the module is different. It is displayed when user focus is placed on (or in) a chart and disappears when focus goes out. Also, initially focused, interactive element "Skip to content after plot" for keyboard users is doing exactly that – moves focus out of the module and closes it.