fix: 1084 rgaa label et boutons representants by olivier-rabot · Pull Request #1281 · SocialGouv/vao

olivier-rabot · 2026-04-20T07:57:56Z

Ticket(s) lié(s)

https://jira-mcas.atlassian.net/jira/software/c/projects/VAO/boards/336?selectedIssue=VAO-1084

Description

Ajout boutons au niveau des representants legaux + precision des labels

Screenshot / liens loom

Check-list

Ma branche est rebase sur main
Des tests ont été écrits pour tous les endpoints créés ou modifiés
Refacto "à la volée" des parties sur lesquelles j'ai codée
Plus de console.log
J'ai ajouté une validation de schéma sur la route que j'ai ajouté ou modifié
J'ai converti les fichiers vue en <script lang="ts">
Mon code est en Typescript (autant que possible)

Testing instructions

revu-bot

PR Review: RGAA Accessibility Fix for Représentants Buttons

This PR improves RGAA (French accessibility standard) compliance by:

Adding descriptive labels to action buttons (edit/delete) that include the representative's index
Moving the save/cancel editing buttons to a separate row with screen-reader-only text
Adding a new .container-flex-end CSS utility class

Overall Assessment

The accessibility intent is correct and the changes are well-structured. However, there are a couple of issues worth addressing.

File	Lines	Severity	Issue
`representants.vue`	37–55	IMPORTANT	Save/cancel icon-only buttons have no visible label — icon rendering depends on `DsfrLinkV2` internals
`representants.vue`	23–27	MINOR	Delete button missing `v-if="props.modifiable"` guard is already present but the accessible label could be inconsistent with the edit button pattern

sweetyume · 2026-04-21T14:48:21Z

+          @click="saveRepresentant(idx)"
+        >
+          <span class="fr-sr-only"
+            >Enregistrer les modifications du représentant {{ idx + 1 }}</span


il y a un problème je pense avec le composant DSFRLink qui n'accepte peut-être pas de children, car en testant, le texte n'apparaît pas, ni quand on désactive le css, ni dans le DOM.
ça peut fonctionner avec aria-label aussi, mais sinon remplacer le DsfrLinkV2 par une balise button avec les classes du dsfr appropriées.

@sweetyume exact
Je suis passé sur des boutons natifs. Le dsfrButton ne gènère pas de nom accessible quand on l'utilise en mode "icon-only", même en lui passant un label en props en sortie on a simplement un attribut title.

sonarqubecloud · 2026-04-22T16:40:25Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

tokenbureau · 2026-04-22T16:41:23Z

🎉 Deployment for commit e2c1104 :

Ingresses

Docker images

📦 docker pull harbor.fabrique.social.gouv.fr/vao/vao/backend:sha-e2c1104ce611168f2ae7ce9647c0f983c48f0b5a
📦 docker pull harbor.fabrique.social.gouv.fr/vao/vao/cron:sha-e2c1104ce611168f2ae7ce9647c0f983c48f0b5a
📦 docker pull harbor.fabrique.social.gouv.fr/vao/vao/external-api:sha-e2c1104ce611168f2ae7ce9647c0f983c48f0b5a
📦 docker pull harbor.fabrique.social.gouv.fr/vao/vao/frontend-bo:sha-e2c1104ce611168f2ae7ce9647c0f983c48f0b5a
📦 docker pull harbor.fabrique.social.gouv.fr/vao/vao/frontend-usagers:sha-e2c1104ce611168f2ae7ce9647c0f983c48f0b5a
📦 docker pull harbor.fabrique.social.gouv.fr/vao/vao/migrations:sha-e2c1104ce611168f2ae7ce9647c0f983c48f0b5a
📦 docker pull maildev/maildev:2.1.0

Debug

olivier-rabot self-assigned this Apr 20, 2026

revu-bot Bot requested a review from revu-bot April 20, 2026 07:58

olivier-rabot marked this pull request as ready for review April 20, 2026 07:58

revu-bot reviewed Apr 20, 2026

View reviewed changes

Comment thread packages/frontend-usagers/src/components/agrement/representants.vue Outdated

olivier-rabot force-pushed the fix/1084-etape-un-renouvelement-agrement-rgaa branch from e81d39d to 860e4ea Compare April 20, 2026 07:58

olivier-rabot temporarily deployed to production April 20, 2026 07:59 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to build-review-auto April 20, 2026 07:59 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to review-auto April 20, 2026 08:01 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to production April 20, 2026 08:25 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to build-review-auto April 20, 2026 08:25 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to review-auto April 20, 2026 08:28 — with GitHub Actions Inactive

olivier-rabot requested a review from l-scherer April 20, 2026 08:34

l-scherer requested changes Apr 20, 2026

View reviewed changes

Comment thread packages/frontend-usagers/src/components/agrement/representants.vue Outdated

l-scherer self-requested a review April 20, 2026 10:47

sweetyume approved these changes Apr 20, 2026

View reviewed changes

olivier-rabot temporarily deployed to build-review-auto April 20, 2026 13:57 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to production April 20, 2026 13:57 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to build-review-auto April 20, 2026 13:57 — with GitHub Actions Inactive

olivier-rabot had a problem deploying to review-auto April 20, 2026 14:00 — with GitHub Actions Error

olivier-rabot added 3 commits April 20, 2026 16:05

fix: 1084 rgaa label et boutons representants

07528d1

fix: 1084 rgaa label et boutons representants

423d679

fix: 1084 rgaa label et boutons representants (retour pr)

1da66c7

olivier-rabot force-pushed the fix/1084-etape-un-renouvelement-agrement-rgaa branch from cb4d2a2 to 1da66c7 Compare April 20, 2026 14:05

olivier-rabot temporarily deployed to production April 20, 2026 14:05 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to build-review-auto April 20, 2026 14:06 — with GitHub Actions Inactive

olivier-rabot temporarily deployed to review-auto April 20, 2026 14:08 — with GitHub Actions Inactive

sweetyume reviewed Apr 21, 2026

View reviewed changes

Comment thread packages/frontend-usagers/src/components/agrement/representants.vue Outdated

fix: 1084 rgaa boutons representants - retours pr boutons sans labels

e2c1104

olivier-rabot temporarily deployed to build-review-auto April 22, 2026 16:33 — with GitHub Actions Inactive

olivier-rabot deployed to build-review-auto April 22, 2026 16:33 — with GitHub Actions Active

olivier-rabot deployed to production April 22, 2026 16:33 — with GitHub Actions Active

olivier-rabot deployed to review-auto April 22, 2026 16:36 — with GitHub Actions Active

olivier-rabot requested a review from sweetyume April 22, 2026 16:48

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix: 1084 rgaa label et boutons representants#1281

fix: 1084 rgaa label et boutons representants#1281
olivier-rabot wants to merge 4 commits intomainfrom
fix/1084-etape-un-renouvelement-agrement-rgaa

olivier-rabot commented Apr 20, 2026 •

edited

Loading

Uh oh!

revu-bot left a comment

Uh oh!

Uh oh!

Uh oh!

sweetyume Apr 21, 2026

Uh oh!

olivier-rabot Apr 22, 2026

Uh oh!

Uh oh!

sonarqubecloud Bot commented Apr 22, 2026

Uh oh!

tokenbureau Bot commented Apr 22, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

olivier-rabot commented Apr 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Ticket(s) lié(s)

Description

Screenshot / liens loom

Check-list

Uh oh!

revu-bot left a comment

Choose a reason for hiding this comment

PR Review: RGAA Accessibility Fix for Représentants Buttons

Overall Assessment

Uh oh!

Uh oh!

Uh oh!

sweetyume Apr 21, 2026

Choose a reason for hiding this comment

Uh oh!

olivier-rabot Apr 22, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

sonarqubecloud Bot commented Apr 22, 2026

Quality Gate passed

Uh oh!

tokenbureau Bot commented Apr 22, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

olivier-rabot commented Apr 20, 2026 •

edited

Loading