Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Alert and Error radio group examples cannot be operated with the keyboard #2196

Closed
Tracked by #1196
williamjstanton opened this issue May 3, 2023 · 0 comments · Fixed by #2197
Closed
Tracked by #1196

Alert and Error radio group examples cannot be operated with the keyboard #2196

williamjstanton opened this issue May 3, 2023 · 0 comments · Fixed by #2197
Labels
bug Something isn't working

Comments

@williamjstanton
Copy link
Collaborator

🐛 Bug Report

The Error and Alert examples of radio groups both have a pre-selected input that is also disabled. This prevents keyboard access to the remaining available options in the group.

To Reproduce

  1. On the Canvas Kit Design Site,
  2. Navigate to components > inputs > Radio > Examples > Error and Alert
  3. Use the Tab key on the keyboard to focus the Alert radio group example
  4. Issue: observe that keyboard focus skips over the radio group

Expected Behavior

Users must be able to focus the radio group, and use the arrow keys to select among available options.

Actual Results

Cannot focus and operate the radio group when a disabled option is pre-selected.

Browser (if applicable)

All of them.

Link to repl or repo (highly encouraged)

https://canvas.workdaydesign.com/components/inputs/radio/#tab=web&heading=alert

Include a screenshot of a visual bug
pre-selected disabled radios
@williamjstanton williamjstanton added the bug Something isn't working label May 3, 2023
@jaclynjessup jaclynjessup mentioned this issue May 3, 2023
Closed
@williamjstanton williamjstanton mentioned this issue May 3, 2023
Merged
10 tasks
alanbsmith pushed a commit that referenced this issue May 25, 2023
@williamjstanton
fix: Fixing Alert and Error radio button examples (#2197)
b6c4813 
Fixes: #2196  

The examples for the Alert and Error radio groups were not accessible to the keyboard because the disabled property was set on an already pre-selected input. This was a good example of something not to do!

[category:Components]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
Canvas Kit
Status: ✅ Done
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix: Fixing Alert and Error radio button examples williamjstanton/canvas-kit
1 participant
@williamjstanton