Skip to content

Conversation

@ada-workbackai
Copy link

Summary

Fixes WCAG 2.1.1 (Keyboard) by removing the clear icon and show/hide password buttons from the keyboard tab order in z-input component.

Issue: The clear (×) button and show/hide password (eye icon) button were in the natural tab order, interrupting the flow between form fields and forcing keyboard users to tab through secondary actions.

Solution: Added tabindex="-1" to both buttons, removing them from keyboard tab sequence while keeping them accessible via mouse/touch and screen reader browse mode.

Test Plan

  • Clear button and show/hide password button removed from tab order
  • Buttons remain clickable via mouse/touch
  • Buttons remain accessible to screen readers via browse mode
  • Form field tab order flows naturally: field 1 → field 2 → submit button

Evidence

Part of the fix for: https://app.workback.ai/dashboard/issue/78/


WCAG Reference:
2.1.1 Keyboard

Add tabindex="-1" to clear button and show/hide password button to remove them from keyboard tab sequence. These secondary actions should not interrupt the natural form field navigation flow.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants