Merge pull request #10893 from demarches-simplifiees/a11y-form-errors

Améliore la restitution des message d'erreur lors d'une soumission en erreur
This commit is contained in:
Corinne Durrmeyer 2024-10-17 10:37:32 +00:00 committed by GitHub
commit fcb868c6a8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
11 changed files with 38 additions and 21 deletions

View file

@ -1,7 +1,13 @@
---
en:
sumup_html:
one: |
Your file has 1 error. <a href="%{url}">Fix-it</a> to continue :
other: |
Your file has %{count} errors. <a href="%{url}">Fix-them</a> to continue :
title:
one: |
Your file has 1 error
other: |
Your file has %{count} errors
content:
one: |
Fix-it to continue:
other: |
Fix-them to continue:

View file

@ -1,7 +1,13 @@
---
fr:
sumup_html:
one: |
Votre dossier contient 1 champ en erreur. <a href="%{url}">Corrigez-la</a> pour poursuivre :
other: |
Votre dossier contient %{count} champs en erreurs. <a href="%{url}">Corrigez-les</a> pour poursuivre :
title:
one: |
Votre dossier contient 1 champ en erreur
other: |
Votre dossier contient %{count} champs en erreur
content:
one: |
Corrigez-la pour poursuivre :
other: |
Corrigez-les pour poursuivre :

View file

@ -1,4 +1,7 @@
.fr-alert.fr-alert--error.fr-mb-3w{ role: "alertdialog" }
.fr-alert.fr-alert--error.fr-mb-3w{ role: 'alert' }
- if dedup_and_partitioned_errors.size > 0
%p#sumup-errors= t('.sumup_html', count: dedup_and_partitioned_errors.size, url: dedup_and_partitioned_errors.first.anchor)
%h3#sumup-errors.fr-alert__title{ data: { controller: 'autofocus' }, tabindex: '-1' }
= t('.sumup_html.title', count: dedup_and_partitioned_errors.size)
%p= t('.sumup_html.content', count: dedup_and_partitioned_errors.size)
= render ExpandableErrorList.new(errors: dedup_and_partitioned_errors)

View file

@ -2,8 +2,10 @@ import { Controller } from '@hotwired/stimulus';
export class AutofocusController extends Controller {
connect() {
const element = this.element as HTMLInputElement;
const element = this.element as HTMLInputElement | HTMLElement;
element.focus();
element.setSelectionRange(0, element.value.length);
if ('value' in element) {
element.setSelectionRange(0, element.value.length);
}
}
}

View file

@ -2,7 +2,7 @@
= procedure_libelle(dossier.procedure)
= status_badge_user(dossier, 'super')
%h2
= t('views.users.dossiers.show.header.dossier_number', dossier_id: dossier.id)
= t('views.users.dossiers.show.header.dossier_number_html', dossier_id: dossier.id)
= t('views.users.dossiers.show.header.created_date', date_du_dossier: I18n.l(dossier.created_at))
= render(partial: 'users/dossiers/expiration_banner', locals: {dossier: dossier})

View file

@ -5,7 +5,7 @@
= status_badge_user(dossier, 'super')
= pending_correction_badge(:for_user) if dossier.pending_correction?
%h2
= t('views.users.dossiers.show.header.dossier_number', dossier_id: dossier.id)
= t('views.users.dossiers.show.header.dossier_number_html', dossier_id: dossier.id)
- if dossier.depose_at.present?
= t('views.users.dossiers.show.header.submit_date', date_du_dossier: I18n.l(dossier.depose_at))

View file

@ -461,7 +461,7 @@ en:
summary: "Summary"
request: "Request"
mailbox: "Mailbox"
dossier_number: "File n. %{dossier_id}"
dossier_number_html: "File <span class='visually-hidden'>number</span> <span aria-hidden='true'>n.</span> %{dossier_id}"
created_date: "- Draft on %{date_du_dossier}"
submit_date: "- Submit on %{date_du_dossier}"
status_overview:

View file

@ -464,7 +464,7 @@ fr:
summary: "Résumé"
request: "Demande"
mailbox: "Messagerie"
dossier_number: "Dossier nº %{dossier_id}"
dossier_number_html: "Dossier <span class='visually-hidden'>numéro</span> <span aria-hidden='true'>nº</span> %{dossier_id}"
created_date: "- En brouillon depuis le %{date_du_dossier}"
submit_date: "- Déposé le %{date_du_dossier}"
status_overview:

View file

@ -12,7 +12,7 @@ describe 'users/dossiers/demande', type: :view do
subject! { render }
it 'renders the header' do
expect(rendered).to have_text("Dossier  #{dossier.id}")
expect(rendered).to have_text("Dossier numéro  #{dossier.id}")
end
it 'renders the dossier infos' do

View file

@ -11,7 +11,7 @@ describe 'users/dossiers/show', type: :view do
subject! { render }
it 'renders a summary of the dossier state' do
expect(rendered).to have_text("Dossier  #{dossier.id}")
expect(rendered).to have_text("Dossier numéro  #{dossier.id}")
expect(rendered).to have_text('dossier est en construction')
end

View file

@ -12,7 +12,7 @@ describe 'users/dossiers/show/header', type: :view do
it 'affiche les informations du dossier' do
expect(rendered).to have_text(dossier.procedure.libelle)
expect(rendered).to have_text("Dossier  #{dossier.id}")
expect(rendered).to have_text("Dossier numéro  #{dossier.id}")
expect(rendered).to have_text("en construction")
expect(rendered).to have_selector("nav.fr-tabs")
@ -25,7 +25,7 @@ describe 'users/dossiers/show/header', type: :view do
let(:dossier) { create(:dossier, :en_construction, procedure: procedure) }
it "affiche les informations du dossier" do
expect(rendered).to have_text("Dossier  #{dossier.id}")
expect(rendered).to have_text("Dossier numéro  #{dossier.id}")
expect(rendered).to have_text("en construction")
end
end
@ -35,7 +35,7 @@ describe 'users/dossiers/show/header', type: :view do
let(:dossier) { create(:dossier, :accepte, procedure: procedure) }
it "n'affiche pas les informations de décision" do
expect(rendered).to have_text("Dossier  #{dossier.id}")
expect(rendered).to have_text("Dossier numéro  #{dossier.id}")
expect(rendered).to have_text("traité")
end
end