Skip to content

Conversation

sidhsharma1992
Copy link
Collaborator

🎯 Overview

This PR implements accessibility rules for 4 previously uncovered FluentUI components as part of expanding ESLint plugin coverage for better React accessibility compliance.

🚀 Changes Made

New Accessibility Rules Added:

  • InfoLabel (infolabel-needs-labelling) - Ensures InfoLabel components have proper accessible names
  • MenuButton (menu-button-needs-labelling) - Validates MenuButton accessibility labeling
  • SplitButton (split-button-needs-labelling) - Ensures SplitButton components are properly labeled
  • Card (card-needs-accessible-name) - Validates Card components have accessible names when interactive

Technical Implementation:

  • ✅ Created 4 new rule files using makeLabeledControlRule factory pattern
  • ✅ Added comprehensive test suites for all new rules (valid/invalid test cases)
  • ✅ Fixed regex typo in labelUtils.ts ([A-Za-l0-9_$][A-Za-z0-9_$])
  • ✅ Updated COVERAGE.md to mark all 4 components as implemented [x]
  • ✅ Created documentation files for all new rules

This PR also addresses one bug that was found during testing : Resolved identifier regex validation in labelUtils.ts

@aubreyquinn aubreyquinn merged commit b89f94d into main Sep 19, 2025
11 checks passed
@aubreyquinn aubreyquinn deleted the users/sidhshar/accessibility-rules-for-infolabel-menubutton-splitbutton-and-card-components branch September 19, 2025 16:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add accessibility rules for InfoLabel, MenuButton, SplitButton, and Card components
3 participants