[Bug 42142] New: The gear icon to toggle panel for login settings needs accessibility updates
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Bug ID: 42142 Summary: The gear icon to toggle panel for login settings needs accessibility updates Initiative type: --- Sponsorship --- status: Product: Koha Version: Main Hardware: All OS: All Status: NEW Severity: normal Priority: P5 - low Component: Accessibility Assignee: koha-bugs@lists.koha-community.org Reporter: blawlor@clamsnet.org QA Contact: testopia@bugs.koha-community.org CC: martin.renvoize@openfifth.co.uk, matt.blenkinsop@openfifth.co.uk, oleonard@myacpl.org View source on any Koha page and paste into the W3C Markup Validation Service. https://validator.w3.org/#validate_by_input Notice the error: The aria-label attribute must not be specified on any i element unless the element has a role value... This violates WCAG 1. 4.1.2 Name, Role, Value (Level A) I think the <a> element should have the role button and aria-label Toggle panel for login settings and the <i> element should have aria-hidden="true" The Toggle panel for login settings also needs some work to announce its state as collapsed and expanded to be more accessible for screen readers. -- You are receiving this mail because: You are the assignee for the bug. You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Laura Escamilla <Laura.escamilla@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Assignee|koha-bugs@lists.koha-commun |Laura.escamilla@bywatersolu |ity.org |tions.com Status|NEW |Needs Signoff -- You are receiving this mail because: You are watching all bug changes. You are the assignee for the bug.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 --- Comment #1 from Laura Escamilla <Laura.escamilla@bywatersolutions.com> --- Created attachment 196716 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=196716&action=edit Bug 42142: Improve accessibility of login settings toggle button Test plan: 1. Log in to the staff interface 2. Click on the logged in menu dropdown 3. View source or inspect the markup for the login settings toggle (gear button) 4. Confirm the icon element has aria-label="Toggle panel for login settings" 5. Confirm the interactive element does not expose aria-expanded 6. Paste the page source into the W3C Markup Validation Service 7. Confirm the validator reports that aria-label must not be specified on the i element Apply the patch: 8. Repeat steps 1-3 9. Confirm the aria-label has been moved from the i element to the toggle link 10. Confirm the i element now uses aria-hidden="true" 11. Confirm the toggle exposes aria-expanded="false" before opening the panel 12. Activate the login settings toggle 13. Confirm the panel opens and aria-expanded changes to "true" 14. Activate the toggle again 15. Confirm the panel closes and aria-expanded changes back to "false" 16. Paste the updated page source into the W3C Markup Validation Service 17. Confirm the validator error is resolved 18. Sign off and have a great day! -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Owen Leonard <oleonard@myacpl.org> changed: What |Removed |Added ---------------------------------------------------------------------------- Patch complexity|--- |Small patch Status|Needs Signoff |Signed Off -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Owen Leonard <oleonard@myacpl.org> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #196716|0 |1 is obsolete| | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 --- Comment #2 from Owen Leonard <oleonard@myacpl.org> --- Created attachment 196727 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=196727&action=edit Bug 42142: Improve accessibility of login settings toggle button Test plan: 1. Log in to the staff interface 2. Click on the logged in menu dropdown 3. View source or inspect the markup for the login settings toggle (gear button) 4. Confirm the icon element has aria-label="Toggle panel for login settings" 5. Confirm the interactive element does not expose aria-expanded 6. Paste the page source into the W3C Markup Validation Service 7. Confirm the validator reports that aria-label must not be specified on the i element Apply the patch: 8. Repeat steps 1-3 9. Confirm the aria-label has been moved from the i element to the toggle link 10. Confirm the i element now uses aria-hidden="true" 11. Confirm the toggle exposes aria-expanded="false" before opening the panel 12. Activate the login settings toggle 13. Confirm the panel opens and aria-expanded changes to "true" 14. Activate the toggle again 15. Confirm the panel closes and aria-expanded changes back to "false" 16. Paste the updated page source into the W3C Markup Validation Service 17. Confirm the validator error is resolved 18. Sign off and have a great day! Signed-off-by: Owen Leonard <oleonard@myacpl.org> -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Brendan Lawlor <blawlor@clamsnet.org> changed: What |Removed |Added ---------------------------------------------------------------------------- QA Contact|testopia@bugs.koha-communit |blawlor@clamsnet.org |y.org | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Brendan Lawlor <blawlor@clamsnet.org> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Signed Off |Passed QA -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Brendan Lawlor <blawlor@clamsnet.org> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #196727|0 |1 is obsolete| | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 --- Comment #3 from Brendan Lawlor <blawlor@clamsnet.org> --- Created attachment 196743 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=196743&action=edit Bug 42142: Improve accessibility of login settings toggle button Test plan: 1. Log in to the staff interface 2. Click on the logged in menu dropdown 3. View source or inspect the markup for the login settings toggle (gear button) 4. Confirm the icon element has aria-label="Toggle panel for login settings" 5. Confirm the interactive element does not expose aria-expanded 6. Paste the page source into the W3C Markup Validation Service 7. Confirm the validator reports that aria-label must not be specified on the i element Apply the patch: 8. Repeat steps 1-3 9. Confirm the aria-label has been moved from the i element to the toggle link 10. Confirm the i element now uses aria-hidden="true" 11. Confirm the toggle exposes aria-expanded="false" before opening the panel 12. Activate the login settings toggle 13. Confirm the panel opens and aria-expanded changes to "true" 14. Activate the toggle again 15. Confirm the panel closes and aria-expanded changes back to "false" 16. Paste the updated page source into the W3C Markup Validation Service 17. Confirm the validator error is resolved 18. Sign off and have a great day! Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Brendan Lawlor <blawlor@clamsnet.org> -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 --- Comment #4 from Brendan Lawlor <blawlor@clamsnet.org> --- Thanks for working on this Laura! This does what is expected and is an improvement for screen reader users. Nice work. Passing QA. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Lucas Gass (lukeg) <lucas@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Version(s)| |26.05.00 released in| | Status|Passed QA |Pushed to main -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 --- Comment #5 from Lucas Gass (lukeg) <lucas@bywatersolutions.com> --- Nice work everyone! Pushed to main for 26.05 -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 Jacob O'Mara <jacob.omara@openfifth.co.uk> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Pushed to main |Pushed to stable Version(s)|26.05.00 |26.05.00,25.11.05 released in| | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42142 --- Comment #6 from Jacob O'Mara <jacob.omara@openfifth.co.uk> --- Thanks all, pushed to 25.11.x -- You are receiving this mail because: You are watching all bug changes.
participants (1)
-
bugzilla-daemon@bugs.koha-community.org