Project

General

Profile

Development #54642

avoir une indication permettant de déterminer l'appartenance d'un bouton radio à un groupe

Added by Serghei Mihai 4 months ago. Updated 3 days ago.

Status:
Solution déployée
Priority:
Normal
Assignee:
Target version:
-
Start date:
08 Jun 2021
Due date:
% Done:

0%

Estimated time:
Patch proposed:
Yes
Planning:
No

Description

De l'audit RGAA GLC #54392:

Les champs de même nature (Monsieur, Madame) doivent :
- Etre regroupés dans une balise fieldset + balise legend OU
- être regroupés dans un même élément possédant la propriété role="group" OU
- posséder une indication permettant de déterminer l'appartenance du champ au groupement de champ (title) OU
- posséder un contenu de propriété WAI-ARIA (aria-label, aria-labelledby, aria- describedby) pertinent.


Files

0001-widgets-add-custom-widget-for-title-attribute-kind-5.patch (2.94 KB) 0001-widgets-add-custom-widget-for-title-attribute-kind-5.patch Serghei Mihai, 08 Jun 2021 11:40 AM
0001-templates-customize-django-s-radio-button-template-5.patch (1.16 KB) 0001-templates-customize-django-s-radio-button-template-5.patch Serghei Mihai, 09 Jun 2021 09:55 AM
0001-templates-customize-django-s-radio-button-template-5.patch (1.01 KB) 0001-templates-customize-django-s-radio-button-template-5.patch Serghei Mihai, 01 Jul 2021 12:07 PM
0002-a11y-define-role-for-django-s-radio-buttons-54642.patch (995 Bytes) 0002-a11y-define-role-for-django-s-radio-buttons-54642.patch Serghei Mihai, 12 Aug 2021 03:01 PM
0001-a11y-add-aria-labelledby-for-widgets-54642.patch (764 Bytes) 0001-a11y-add-aria-labelledby-for-widgets-54642.patch Serghei Mihai, 12 Aug 2021 03:01 PM
0003-a11y-define-role-attribute-for-radio-inputs-54642.patch (699 Bytes) 0003-a11y-define-role-attribute-for-radio-inputs-54642.patch Serghei Mihai, 16 Aug 2021 09:42 AM
0002-templates-add-support-for-custom-widget-template-546.patch (2.31 KB) 0002-templates-add-support-for-custom-widget-template-546.patch Serghei Mihai, 16 Aug 2021 09:42 AM
0001-a11y-add-aria-labelledby-for-widgets-54642.patch (764 Bytes) 0001-a11y-add-aria-labelledby-for-widgets-54642.patch Serghei Mihai, 16 Aug 2021 09:42 AM
0002-templates-add-support-for-custom-widget-template-546.patch (2.31 KB) 0002-templates-add-support-for-custom-widget-template-546.patch Serghei Mihai, 16 Aug 2021 04:54 PM
0001-a11y-add-aria-labelledby-for-widgets-54642.patch (764 Bytes) 0001-a11y-add-aria-labelledby-for-widgets-54642.patch Serghei Mihai, 16 Aug 2021 04:54 PM
0003-a11y-add-custom-rendering-for-radio-inputs-54642.patch (803 Bytes) 0003-a11y-add-custom-rendering-for-radio-inputs-54642.patch Serghei Mihai, 16 Aug 2021 04:54 PM

Related issues

Related to Authentic 2 - Development #54675: mise à jour des settings pour permettre à gadjo de surcharger les templates des widgets DjangoSolution déployée08 Jun 2021

Actions
Related to Gadjo - Development #55297: templates: attribuer un identifiant au bloc contenant le libellé du champ de formulaireSolution déployée01 Jul 2021

Actions

Associated revisions

Revision 1fa018a2 (diff)
Added by Serghei Mihai about 2 months ago

a11y: add aria-labelledby for widgets (#54642)

Revision 2a6ba2ca (diff)
Added by Serghei Mihai about 2 months ago

templates: add support for custom widget template (#54642)

Revision 6b941855 (diff)
Added by Serghei Mihai about 1 month ago

a11y: add custom rendering for radio inputs (#54642)

Revision beff3e08 (diff)
Added by Frédéric Péters about 1 month ago

Revert "a11y: add custom rendering for radio inputs (#54642)"

This reverts commit 6b941855c8a7f2c2e0fb8d60f9a6c288019b48bb.

Revision 4b3acfd8 (diff)
Added by Serghei Mihai 11 days ago

a11y: add custom rendering for radio inputs (#54642)

History

#1

Updated by Frédéric Péters 4 months ago

Ticket à plutôt déplacer vers authentic pour son rendu de son champ "civilité" ?

#2

Updated by Thomas Jund 4 months ago

(Ou comment retomber sur la problématique de pouvoir faire des "groupes de champs")

#3

Updated by Serghei Mihai 4 months ago

Je me dis qu'on pourrait appliquer cela aussi aux champs dans wcs.
Partir sur la suggestion donnée dans https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute#example_3_radio_groups

#4

Updated by Frédéric Péters 4 months ago

(Ou comment retomber sur la problématique de pouvoir faire des "groupes de champs")

Ça parle ici d'un champ "civilité" unique.

Je me dis qu'on pourrait appliquer cela aussi aux champs dans wcs.

Sur le cas donné w.c.s. applique déjà role="radiogroup" et donne un aria-labelledby.

#5

Updated by Serghei Mihai 4 months ago

  • Project changed from Intégrations graphiques Publik to Authentic 2

Frédéric Péters a écrit :

Sur le cas donné w.c.s. applique déjà role="radiogroup" et donne un aria-labelledby.

J'avais pas les yeux devant les trous, où l'inverse.

#6

Updated by Serghei Mihai 4 months ago

Template custom pour les attributs de type "title".

#7

Updated by Serghei Mihai 4 months ago

  • Subject changed from accessibilité: avoir une indication permettant de déterminer l'appartenance d'un bouton radio à un groupe to avoir une indication permettant de déterminer l'appartenance d'un bouton radio à un groupe pour les champs de type "title"
#8

Updated by Frédéric Péters 4 months ago

Pourquoi ne pas traiter tous les champs forms.RadioSelect ? Et comme je vois que ça passe par |with_template, ça pourrait avoir lieu dans gadjo. (?)

#10

Updated by Serghei Mihai 4 months ago

  • Status changed from Solution proposée to En cours
  • Project changed from Authentic 2 to Gadjo

En effet c'est plus pertinent de le faire dans gadjo.

#11

Updated by Serghei Mihai 4 months ago

  • Subject changed from avoir une indication permettant de déterminer l'appartenance d'un bouton radio à un groupe pour les champs de type "title" to avoir une indication permettant de déterminer l'appartenance d'un bouton radio à un groupe
#12

Updated by Serghei Mihai 4 months ago

Avec une simple re-déclaration du fichier radio.html dans Gadjo cela ne marchera pas car au niveau de Hobo le premier loaders est django.template.loaders.filesystem.Loader qui cherche dans les répértoires de Django et trouve le fichier django/forms/widgets/radio.html.

#13

Updated by Serghei Mihai 4 months ago

Même en changeant l'ordre dans Hobo cela ne fonctionnera pas: https://docs.djangoproject.com/en/2.2/ref/forms/renderers/#djangotemplates

#14

Updated by Serghei Mihai 4 months ago

Sauf à utiliser un renderer différent: https://docs.djangoproject.com/en/2.2/ref/forms/renderers/#django.forms.renderers.TemplatesSetting

Cela implique la modification des settings.py dans toutes les applications:

  • ajouter django.forms dans INSTALLED_APPS, après gadjo
  • rajouter FORM_RENDERER = 'django.forms.renderers.TemplatesSetting'
#15

Updated by Serghei Mihai 4 months ago

  • Related to Development #54675: mise à jour des settings pour permettre à gadjo de surcharger les templates des widgets Django added
#17

Updated by Serghei Mihai 3 months ago

  • Status changed from Solution proposée to En cours

Discussion de vive voix avec Thomas.
Il est dommage de pointer le premier input avec aria-labelledby="{{ id }}_0" au lieu de cibler le titre du champ.

A voir si on ne peut pas faire quelque chose au niveau de Gadjo pour passer les attributs du champ dans le contexte du widget, genre le "id" du div.

#18

Updated by Serghei Mihai 3 months ago

  • Related to Development #55297: templates: attribuer un identifiant au bloc contenant le libellé du champ de formulaire added
#19

Updated by Serghei Mihai 3 months ago

Nouvelle proposition avec l'identifiant du bloc contenant le libellé (patch proposé dans #55297) dans aria-labelledby.

#20

Updated by Thomas Jund about 2 months ago

Ok sur le principe de pointer le label du group vers la `div.title` qui contient le label principal et les information de champ optionnel ou obligatoire (ce qui diffère légement de la façon dont WCS gère cela).

Si l'horizon est d'harmoniser avec les champs WCS (#55988) alors je ne sais pas si besoin d'une `ul li` non présent dans les radiosgroup WCS. Autant avoir le même markup et faire évoluer les 2 de manière synchrone ?

#21

Updated by Serghei Mihai about 2 months ago

Thomas Jund a écrit :

Si l'horizon est d'harmoniser avec les champs WCS (#55988) alors je ne sais pas si besoin d'une `ul li` non présent dans les radiosgroup WCS. Autant avoir le même markup et faire évoluer les 2 de manière synchrone ?

C'est un peu touchy car dans wcs l'attributs role est déclaré au niveau du widget utilisé pour le rendu de tous les boutons radio. Dans les autres apps on utilise RadioSelect de django qui n'a pas d'attribut pouvant être utilisé pour détécter le rôle.

Pour aller dans le sens de l'harmonisation l'attribut aria-labelledy peut déjà être placé au niveau du div.content pour tous les widgets.
Ensuite je garde le ul avec son @role=radiogroup".

#22

Updated by Thomas Jund about 2 months ago

Il me semble que le `role="radiogroup"` et l'attribut `aria-labelledby` doivent être sur le même élément

#23

Updated by Serghei Mihai about 1 month ago

Right.

Je propose d'ajouter la possibilité de définition des templates pour chaque type de widget.
Ensuite pour les boutons radio ajouter le role au niveau du div.content.

Il reste qu'il faut virer les ul du rendu par défaut de Django, mais déjà je joints des patchs pour valider le principe.

#25

Updated by Thomas Jund about 1 month ago

  • Status changed from Solution proposée to Solution validée
#26

Updated by Serghei Mihai about 1 month ago

  • Status changed from Solution validée to Résolu (à déployer)
commit 6b941855c8a7f2c2e0fb8d60f9a6c288019b48bb
Author: Serghei Mihai <smihai@entrouvert.com>
Date:   Fri Aug 13 12:20:35 2021 +0200

    a11y: add custom rendering for radio inputs (#54642)

commit 2a6ba2ca0663ecbe9eacef9e219c51f3c1203676
Author: Serghei Mihai <smihai@entrouvert.com>
Date:   Fri Aug 13 12:13:03 2021 +0200

    templates: add support for custom widget template (#54642)

commit 1fa018a2a80d5aa79a031f895262ddb6fe266d15
Author: Serghei Mihai <smihai@entrouvert.com>
Date:   Thu Aug 12 15:16:51 2021 +0200

    a11y: add aria-labelledby for widgets (#54642)
#27

Updated by Frédéric Péters about 1 month ago

  • Status changed from Résolu (à déployer) to Solution déployée
#28

Updated by Frédéric Péters about 1 month ago

  • Status changed from Solution déployée to En cours

Reverté, c'est utilisé aussi en front et ça fait des régressions visibles. (cf #55988)

#29

Updated by Serghei Mihai 28 days ago

Sauf contre-avis je souhaite pousser de nouveau ces commits et celui de #56114 et déployer en recette rapidement pour ensuite gérer les différences de rendu.

#30

Updated by Frédéric Péters 28 days ago

Ok s'il s'agit de pousser correctement ça et les bouts de publik-base-theme qui s'y mêlent et tout déployer rapidement et vraiment faire un tour attentif de l'existant.

#31

Updated by Serghei Mihai 28 days ago

Je compte pousser:

a11y: add custom rendering for radio inputs (#54642)

et
templates: customize checkbox and radio buttons rendering (#56114)

et tagguer.

Puis le patch de #55988, tagguer et tout deployer au même moment.
Ensuite faire le tour des toutes les recettes et faire les tickets pour les corrections nécessaires.

#32

Updated by Thomas Jund 7 days ago

  • Status changed from En cours to Solution validée
#33

Updated by Serghei Mihai 7 days ago

Je pousse le tout lundi.

#34

Updated by Frédéric Péters 7 days ago

Vendredi si possible ?

#35

Updated by Serghei Mihai 7 days ago

ok

#36

Updated by Serghei Mihai 3 days ago

  • Status changed from Solution validée to Résolu (à déployer)
commit 4b3acfd8766b45ad4af804103bd6b010454a3b10 (origin/main, origin/HEAD)
Author: Serghei Mihai <smihai@entrouvert.com>
Date:   Fri Aug 13 12:20:35 2021 +0200

    a11y: add custom rendering for radio inputs (#54642)
#37

Updated by Frédéric Péters 3 days ago

  • Status changed from Résolu (à déployer) to Solution déployée

Also available in: Atom PDF