vuetifyjs/vuetify

[Feature Request] Table Select Checkboxes dont have labels by default

Closed

#9 956 ouverte le 12 déc. 2019

Voir sur GitHub
 (0 commentaires) (2 réactions) (0 assignés)TypeScript (40 995 stars) (7 139 forks)batch import
C: VDataTableT: enhancementgood first issue

Description

Problem to solve

When having a select checkbox for the tables the following happens by default

  • checkboxes get created (they have a label attached to it but no aria-label or aria-labelledby)
  • header checkbox doesnt have a label

Proposed solution

  • add to the header of the table select a label and aria-label prop that can be editable
  • at times the checkbox might not need to have the label displayed so aria-label should be the one that does the trick from an accessibility point of view

Guide contributeur

Stack technique
vuetypescript
Domaine
frontendaccessibility
Type d'issue
accessibility
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
2
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
under 1 hour
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
stale
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
clear
Prérequis
Vue.jsVuetify table componentARIA attributes
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
75
Direction de recherche
Investigate the Vuetify table component (likely in VDataTable or VSimpleTable) to find where header checkboxes are rendered. Look for existing `label` and `aria label` props on other components for pattern. Add similar props to the header checkbox, ensuring the `aria label` is used when no visible label is present.