freshworks / nucleus

Nucleus - The Freshworks Design System in Ember
https://freshworks-nucleus.netlify.com/
14 stars 11 forks source link

Modal Keyboard Navigation #171

Closed sharath-sriram closed 4 years ago

sharath-sriram commented 4 years ago

When keyboard focus is on the last element of the modal, using Shift+Tab to navigate to the previous focusable element does not work as intended. Focus is stuck in a loop between last and first focusable element if Shift+Tab is used.

Steps to reproduce

  1. Open the Slider in https://freshworks-nucleus.netlify.com/docs/components/nucleus-modal

  2. Navigate to the "Next" button with keyboard. Use Shift+Tab to navigate to previous element.

  3. The intended behaviour is focus on the "Cancel" button but it moves to the "X" (close) button. On clicking Shift+Tab again, you move to the Next Button (This is the right action)

Expected Behaviour

Focus should shift to previous focusable element when trying to use Shift+Tab from the last focusable element.