Replace aria-live with focus shift

This commit is contained in:
Corinne Durrmeyer 2024-07-29 18:09:15 +02:00 committed by Paul Chavard
parent f6a34f1b4c
commit 523a295be0
No known key found for this signature in database
4 changed files with 12 additions and 6 deletions

View file

@ -4,4 +4,5 @@ en:
aria_label: "Show password" aria_label: "Show password"
label: "Show" label: "Show"
email_suggest: email_suggest:
wanna_say: 'Do you mean to say ?' mistake: "The address seems wrong"
wanna_say: "Do you mean to say:"

View file

@ -4,4 +4,5 @@ fr:
aria_label: "Afficher le mot de passe" aria_label: "Afficher le mot de passe"
label: "Afficher" label: "Afficher"
email_suggest: email_suggest:
wanna_say: 'Voulez-vous dire ?' mistake: "L'adresse semble erronée"
wanna_say: "Vouliez-vous écrire :"

View file

@ -29,10 +29,14 @@
%label.fr--password__checkbox.fr-label{ for: show_password_id }= t('.show_password.label') %label.fr--password__checkbox.fr-label{ for: show_password_id }= t('.show_password.label')
- if email? - if email?
.suspect-email.hidden{ data: { "email-input-target": 'ariaRegion'}, aria: { live: 'off' } } .suspect-email.hidden{ data: { "email-input-target": 'ariaRegion' }, tabindex: '-1' }
= render Dsfr::AlertComponent.new(title: t('.email_suggest.wanna_say'), state: :info, heading_level: :div) do |c| = render Dsfr::AlertComponent.new(title: t('.email_suggest.mistake'), state: '', extra_class_names: 'fr-alert--info' ) do |c|
- c.with_body do - c.with_body do
%p{ data: { "email-input-target": 'suggestion'} } exemple@gmail.com  ? %p
= t('.email_suggest.wanna_say')
%span{ data: { "email-input-target": 'suggestion'} }
exemple@gmail.com
= "?"
%p %p
= button_tag type: 'button', class: 'fr-btn fr-btn--sm fr-mr-3w', data: { action: 'click->email-input#accept'} do = button_tag type: 'button', class: 'fr-btn fr-btn--sm fr-mr-3w', data: { action: 'click->email-input#accept'} do
= t('utils.yes') = t('utils.yes')

View file

@ -39,7 +39,7 @@ export class EmailInputController extends ApplicationController {
if (data && data.suggestions && data.suggestions.length > 0) { if (data && data.suggestions && data.suggestions.length > 0) {
this.suggestionTarget.innerHTML = data.suggestions[0]; this.suggestionTarget.innerHTML = data.suggestions[0];
show(this.ariaRegionTarget); show(this.ariaRegionTarget);
this.ariaRegionTarget.setAttribute('aria-live', 'assertive'); this.ariaRegionTarget.focus();
} }
} }