[scanner] fix: add ARIA labels to utility section components#19345
Conversation
- CollapsibleSection: improve aria-label to include expand/collapse state - QuickActionsSection: add explicit aria-label to action buttons Signed-off-by: clubanderson <club@redhat.com>
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
✅ Deploy Preview for kubestellarconsole ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
🐝 Hi @clubanderson! I'm Trusted users — org members and contributors with write access — can mention Automation may take a moment to start, and follow-up happens through workflow activity rather than chat replies. |
|
👋 Hey @clubanderson — thanks for opening this PR!
This is an automated message. |
There was a problem hiding this comment.
Pull request overview
This PR addresses accessibility scanner findings by improving accessible naming for interactive elements in the modal utility sections, focusing on ARIA labeling in UtilitySections.tsx.
Changes:
- Updates the
CollapsibleSectiontoggle button ARIA labeling behavior. - Adds an
aria-labeltoQuickActionsSectionaction buttons.
| <button | ||
| key={action.id} | ||
| onClick={action.onClick} | ||
| disabled={action.disabled} | ||
| aria-label={action.label} | ||
| className={cn('flex items-center gap-1.5 rounded-lg px-3 py-2 text-sm font-medium transition-colors disabled:cursor-not-allowed disabled:opacity-50', TOUCH_TARGET_HEIGHT_CLASS, variantStyles[action.variant || 'default'])} |
| aria-expanded={isOpen} | ||
| aria-label={title} | ||
| aria-label={`${isOpen ? 'Collapse' : 'Expand'} ${title} section`} |
|
Thank you for your contribution! Your PR has been merged. Check out what's new:
Stay connected: Slack #kubestellar-dev | Multi-Cluster Survey |
✅ Post-Merge Verification: passedCommit: |
|
Post-merge build verification passed ✅ Both Go and frontend builds compiled successfully against merge commit |
Fixes #19339, Fixes #19340
Adds missing ARIA labels to modal and utility components not covered by PR #19343.
Changes
aria-labelon CollapsibleSection to include expand/collapse state; addedaria-labelto QuickActionsSection buttonsNotes
<button>elements with visible text labels that already serve as accessible namesrole="tab",aria-selected, and visible text labels