-
-
Notifications
You must be signed in to change notification settings - Fork 796
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.
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
Unable to tab through radio buttons in Firefox #596
Comments
Looks like the radio group needs to use a roving tab index to make this work properly. Basically, only the checked radio will have a tabindex so tabbing in and out of the radio group will focus the correct control. The browser normally does this on its own when radios are linked. Unfortunately, with radios in shadow roots we don't get this behavior for free. The current behaviors appears to work in all browsers except Firefox. The correct behavior of a radio group appears to be:
|
I'm sorry but this is not working properly in FF. With tabbing the focus does move into radio group but does not progress out of it onto next form elements unless you first move with arrow key up/down and even then only in random cases. |
Please test against https://next.shoelace.style/components/radio It's working for me in Firefox. |
I can confirm this working in FF but there's an JS error now in Chrome console
This could be related to Chrome tabIndex issue but not neccessarily. |
Describe the bug
In a form, either HTML
<form>
or<sl-form>
, we are unable to tab through radio buttons. Tabbing stops at radio button options.Demo
https://codepen.io/trailrun80/pen/MWvNOQp
Try it in Firefox
Browser / OS
The text was updated successfully, but these errors were encountered: