patternfly / patternfly/patternfly-react
[react] Resolve violations for WCAG 2.2 a11y tool bump
Personne n'a encore pris cette issue.
- Langage dominant
- TypeScript
- Étoiles
- 862
- Forks
- 392
- Merge moyen
- 4 j 8 h
- PR mergées (30 j)
- 9
Description
Describe the enhancement or change
Follow up to #12296
All reported 2.2AA errors are target-size violations. The common trend behind these errors is the placement of sibling Checkboxes and Radios in our examples.
Component issues:
-
ClipboardCopy: inline + compact clipboard copies that contain additional actions. Needs additional spacing between the internal copy action and additional actions, and possibly between additional actions as well.
-
Checkbox: sibling checkboxes. Needs additional spacing.
-
Label: the following needs additional spacing between actionable elements
- All labels that are links or clickable with the close button
- All compact labels (base, link, clickable) with the close button
- Editable labels with the close button
-
Truncate: truncated links and sibling truncated links
Example-only target-size violations due to checkboxes/radios:
-
Card
-
CodeEditor
-
Drawer
-
FileUpload, both Single and Multiple
-
Modal
-
Progress
-
ProgressStepper
-
Popover
-
SearchInput
-
Select (templates tab)
-
Table (demos tab) - specifically demos contain truncated links
-
Tooltip
CodeEditor was also getting a couple contrast violations for the monaco text colors in light theme.
Jira Issue: PF-4439
Guide de contribution
Ouvrir le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Piste de recherche
Commencez par exécuter les vérifications d’accessibilité sur les exemples de composants listés, en vous concentrant sur les violations de taille cible impliquant des Checkboxes, des Radios, des liens et des actions adjacents. Inspectez ClipboardCopy, Checkbox, Label, Truncate, les composants d’exemple nommés et CodeEditor ; le travail est terminé lorsque les violations de taille cible 2.2AA signalées et les violations de contraste du thème clair de CodeEditor sont résolues.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- react, typescript
- Domaine
- accessibility, frontend, testing
- Type d'issue
- Bug
- Difficulté
- 4/5
- Temps estimé
- 3-5 jours
- Activité
- Active
- Clarté
- Plutôt claire
- Accessibilité débutants
- 52/100