-
-
Notifications
You must be signed in to change notification settings - Fork 3.6k
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
[4.0] Switcher Field #24463
[4.0] Switcher Field #24463
Conversation
I have tested this item ✅ successfully on 6f96df0 using Module. System information
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/24463. |
As for the final location for the CSS file, I'd put it into https://github.com/joomla/joomla-cms/tree/4.0-dev/build/media_source/system/css/fields which ends up in /media/system/css/fields after building. |
@Bakual thanks that is what I was thinking too OR as scss to be compiled into the templates |
instead:
When I copy the source code of a page and read it outside the context of the backend (as a separate document), the screen reader correctly reads the label of each switch and its status. (Do not load any js then.) Firefox test: switches do not receive keyboard focus at all |
Which exact page. Maybe there is a markup bug somewhere |
I "think" I know what the problem is. It's not the code here. But could you please tell me the page you tested so I can confirm |
@zwiastunsw I think it could be because the fieldsets are nested inside other fieldsets https://test-cases.tink.uk/nested-fieldsets/index.html |
@zwiastunsw if that is the problem then we can use an alternative method instead of fieldset which is to use role=group |
I tested Site Modules > Breadcrumbs. |
@zwiastunsw I am going to have to reach out to some external a11y experts on this. As you discovered the code works perfectly on a plain html page but not within joomla. I cant see anything in joomla that would break it. |
@zwiastunsw @wilsonge I found the problem. It is NOT in the code here. The problem is in the tabs code. When you open a module for the first time ALL the sections are set with aria-hidden=true. The first tab should not be |
Updated code and original post with test instructions |
The js tests are failing as expected as the js is no longer present. Should I remove the tests in this pr? |
tests removed |
Thanks! |
Woohoo |
Pull Request for Issue #20986
Summary of Changes
replace the custom element for the switcher field with pure css and accessible
it uses a legend to describe the fieldset and the label for the values as normal
Testing Instructions
Requires npm i
Expected result
Visual
Notes