add error_id to described_by

app/components/editable_champ/checkbox_component/checkbox_component.html.haml

@@ -1,6 +1,6 @@
 .fr-checkbox-group
   = @form.check_box :value,
-    { required: @champ.required?, id: @champ.input_id, checked: @champ.true?, aria: { describedby: @champ.describedby_id }, class: class_names('required' => @champ.required?)},
+    { required: @champ.required?, id: @champ.input_id, checked: @champ.true?, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, class: class_names('required' => @champ.required?)},
     'true',
     'false'
   %label.fr-label{ for: @champ.input_id, id: @champ.labelledby_id }

app/components/editable_champ/cnaf_component/cnaf_component.html.haml

@@ -4,14 +4,14 @@
     %p.notice= t('.numero_allocataire_notice')
     = @form.text_field :numero_allocataire,
       required: @champ.required?,
-      aria: { describedby: @champ.describedby_id },
+      aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" },
       class: "width-33-desktop", id: @champ.numero_allocataire_input_id
 
   %div
     = @form.label :code_postal, t('.code_postal_label'), for: @champ.code_postal_input_id
     %p.notice= t('.code_postal_notice')
     = @form.text_field :code_postal,
       required: @champ.required?,
-      aria: { describedby: @champ.describedby_id },
+      aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" },
       class: "width-33-desktop",
       id: @champ.code_postal_input_id

app/components/editable_champ/date_component/date_component.html.haml

@@ -1,6 +1,6 @@
 = @form.date_field :value,
   input_opts(id: @champ.input_id,
-  aria: { describedby: @champ.describedby_id },
+  aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" },
   value: @champ.value,
   required: @champ.required?,
   class: "width-33-desktop")

app/components/editable_champ/datetime_component/datetime_component.html.haml

@@ -1 +1 @@
-= @form.datetime_field(:value, input_opts(value: formatted_value_for_datetime_locale, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, data: { controller: 'datetime' }))
+= @form.datetime_field(:value, input_opts(value: formatted_value_for_datetime_locale, id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, data: { controller: 'datetime' }))

app/components/editable_champ/decimal_number_component/decimal_number_component.html.haml

@@ -1 +1 @@
-= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, required: @champ.required?, pattern: "-?[0-9]+([\.,][0-9]{1,3})?", inputmode: :decimal, data: { controller: 'format', format: :decimal }))
+= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, required: @champ.required?, pattern: "-?[0-9]+([\.,][0-9]{1,3})?", inputmode: :decimal, data: { controller: 'format', format: :decimal }))

app/components/editable_champ/departements_component/departements_component.html.haml

@@ -1 +1 @@
-= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "fr-select"
+= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, class: "fr-select"

app/components/editable_champ/dgfip_component/dgfip_component.html.haml

@@ -4,13 +4,13 @@
     %p.notice= t('.numero_fiscal_notice')
     = @form.text_field :numero_fiscal,
       required: @champ.required?,
-      aria: { describedby: @champ.describedby_id },
+      aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" },
       class: "width-33-desktop", id: @champ.numero_fiscal_input_id
 
   %div
     = @form.label :reference_avis, t('.reference_avis_label'), for: @champ.reference_avis_input_id
     %p.notice= t('.reference_avis_notice')
     = @form.text_field :reference_avis,
       required: @champ.required?,
-      aria: { describedby: @champ.describedby_id },
+      aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" },
       class: "width-33-desktop", id: @champ.reference_avis_input_id

app/components/editable_champ/dossier_link_component/dossier_link_component.html.haml

@@ -1,4 +1,4 @@
-= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, inputmode: :numeric, min: 1, pattern: "[0-9]{1,12}", autocomplete: 'off', required: @champ.required?, class: "width-33-desktop #{@champ.blank? ? '' : 'small-margin'}"))
+= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, inputmode: :numeric, min: 1, pattern: "[0-9]{1,12}", autocomplete: 'off', required: @champ.required?, class: "width-33-desktop #{@champ.blank? ? '' : 'small-margin'}"))
 
 - if [email protected]? && !dossier.blank?
   .fr-info-text.fr-mb-4w= sanitize(dossier.text_summary)

app/components/editable_champ/drop_down_list_component/drop_down_list_component.html.haml

@@ -27,7 +27,7 @@
     required: @champ.required?,
     id: @champ.input_id,
     class: select_class_names,
-    aria: { describedby: @champ.describedby_id }
+    aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }
 
 - if @champ.drop_down_other?
   %div{ class: other_element_class_names }

app/components/editable_champ/email_component/email_component.html.haml

@@ -1 +1 @@
-= @form.email_field(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, required: @champ.required?))
+= @form.email_field(:value, input_opts(id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, required: @champ.required?))

app/components/editable_champ/engagement_juridique_component/engagement_juridique_component.html.haml

@@ -1 +1 @@
-= @form.text_field(:value, input_opts(id: @champ.input_id, required: @champ.required?, aria: { describedby: @champ.describedby_id }))
+= @form.text_field(:value, input_opts(id: @champ.input_id, required: @champ.required?, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }))

app/components/editable_champ/epci_component/epci_component.html.haml

@@ -8,4 +8,4 @@
     .fr-select-group
       = @form.label :value, for: @champ.epci_input_id, class: 'fr-label' do
         - "EPCI"
-      = @form.select :value, epci_options, epci_select_options, required: @champ.required?, id: @champ.epci_input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile fr-select"
+      = @form.select :value, epci_options, epci_select_options, required: @champ.required?, id: @champ.epci_input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, class: "width-33-desktop width-100-mobile fr-select"

app/components/editable_champ/expression_reguliere_component/expression_reguliere_component.html.haml

@@ -1 +1 @@
-= @form.text_field(:value, input_opts(id: @champ.input_id, placeholder: @champ.expression_reguliere_exemple_text, required: @champ.required?, aria: { describedby: @champ.describedby_id }))
+= @form.text_field(:value, input_opts(id: @champ.input_id, placeholder: @champ.expression_reguliere_exemple_text, required: @champ.required?, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }))

app/components/editable_champ/iban_component/iban_component.html.haml

@@ -1 +1 @@
-= @form.text_field(:value, input_opts(id: @champ.input_id, required: @champ.required?, aria: { describedby: @champ.describedby_id }, data: { controller: 'format', format: 'iban' }, class: "width-66-desktop", maxlength: 34 + 9)) # count space separator of 4 digits-groups
+= @form.text_field(:value, input_opts(id: @champ.input_id, required: @champ.required?, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, data: { controller: 'format', format: 'iban' }, class: "width-66-desktop", maxlength: 34 + 9)) # count space separator of 4 digits-groups

app/components/editable_champ/integer_number_component/integer_number_component.html.haml

@@ -1 +1 @@
-= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, pattern: "-?[0-9]*", inputmode: :numeric, required: @champ.required?, data: { controller: 'format', format: :integer }))
+= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, pattern: "-?[0-9]*", inputmode: :numeric, required: @champ.required?, data: { controller: 'format', format: :integer }))

app/components/editable_champ/linked_drop_down_list_component/linked_drop_down_list_component.html.haml

@@ -2,7 +2,7 @@
   .fr-select-group
     = render EditableChamp::ChampLabelComponent.new form: @form, champ: @champ, seen_at: @seen_at
 
-    = @form.select :primary_value, @champ.primary_options, {}, required: @champ.required?, class: 'fr-select fr-mb-3v', id: @champ.input_id, aria: { describedby: @champ.describedby_id }
+    = @form.select :primary_value, @champ.primary_options, {}, required: @champ.required?, class: 'fr-select fr-mb-3v', id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }
 
 - if @champ.has_secondary_options_for_primary?
   .secondary

app/components/editable_champ/mesri_component/mesri_component.html.haml

@@ -4,5 +4,5 @@
     %p.notice= t('.ine_notice')
     = @form.text_field :ine,
       required: @champ.required?,
-      aria: { describedby: @champ.describedby_id },
+      aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" },
       class: "width-33-desktop", id: @champ.input_id

app/components/editable_champ/multiple_drop_down_list_component/multiple_drop_down_list_component.html.haml

@@ -3,7 +3,7 @@
     - capture do
       .fr-fieldset__element
         .fr-checkbox-group
-          = b.check_box(checked: @champ.selected_options.include?(b.value), aria: { describedby: @champ.describedby_id }, id: @champ.checkbox_id(b.value), class: 'fr-checkbox-group__checkbox')
+          = b.check_box(checked: @champ.selected_options.include?(b.value), aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, id: @champ.checkbox_id(b.value), class: 'fr-checkbox-group__checkbox')
           %label.fr-label{ for: @champ.checkbox_id(b.value) }
             = b.text
 

app/components/editable_champ/number_component/number_component.html.haml

@@ -1 +1 @@
-= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, required: @champ.required?, pattern: "-?[0-9]*", inputmode: :decimal))
+= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, required: @champ.required?, pattern: "-?[0-9]*", inputmode: :decimal))

app/components/editable_champ/pays_component/pays_component.html.haml

@@ -1 +1 @@
-= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile fr-select"
+= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, class: "width-33-desktop width-100-mobile fr-select"

app/components/editable_champ/phone_component/phone_component.html.haml

@@ -1,4 +1,4 @@
 -# Allowed @formats:
 -# very light validation is made client-side
 -# stronger validation is made server-side
-= @form.phone_field(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, required: @champ.required?, pattern: "[^a-z^A-Z]+"))
+= @form.phone_field(:value, input_opts(id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, required: @champ.required?, pattern: "[^a-z^A-Z]+"))

app/components/editable_champ/pole_emploi_component/pole_emploi_component.html.haml

@@ -4,5 +4,5 @@
     %p.notice= t('.identifiant_notice')
     = @form.text_field :identifiant,
       required: @champ.required?,
-      aria: { describedby: @champ.describedby_id },
+      aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" },
       class: "width-33-desktop", id: @champ.input_id

app/components/editable_champ/regions_component/regions_component.html.haml

@@ -1 +1 @@
-= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile fr-select"
+= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, class: "width-33-desktop width-100-mobile fr-select"

app/components/editable_champ/rna_component/rna_component.html.haml

@@ -1,4 +1,4 @@
-= @form.text_field(:value, input_opts( id: @champ.input_id, aria: { describedby: @champ.describedby_id }, data: { controller: 'turbo-input format', format: 'deleteSpace', turbo_input_load_on_connect_value: @champ.prefilled? && @champ.value.present? && @champ.data.blank?, turbo_input_url_value: update_path }, required: @champ.required?, pattern: "W[0-9A-Z]{9}", class: "width-33-desktop", maxlength: 10))
+= @form.text_field(:value, input_opts( id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, data: { controller: 'turbo-input format', format: 'deleteSpace', turbo_input_load_on_connect_value: @champ.prefilled? && @champ.value.present? && @champ.data.blank?, turbo_input_url_value: update_path }, required: @champ.required?, pattern: "W[0-9A-Z]{9}", class: "width-33-desktop", maxlength: 10))
 
 .rna-info{ id: dom_id(@champ, :rna_info) }
   = render 'shared/champs/rna/association', champ: @champ, error: nil

app/components/editable_champ/rnf_component/rnf_component.html.haml

@@ -1,4 +1,4 @@
-= @form.text_field :external_id, input_opts(id: @champ.input_id, required: @champ.required?, class: "width-33-desktop fr-input small-margin", aria: { describedby: @champ.describedby_id })
+= @form.text_field :external_id, input_opts(id: @champ.input_id, required: @champ.required?, class: "width-33-desktop fr-input small-margin", aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" })
 
 .rnf-info{ id: dom_id(@champ, :rnf_info) }
   - if @champ.fetch_external_data_error?

app/components/editable_champ/siret_component/siret_component.html.haml

@@ -1,4 +1,4 @@
-= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, data: { controller: 'turbo-input format', format: 'siret', turbo_input_load_on_connect_value: @champ.prefilled? && @champ.value.present? && @champ.etablissement.blank?, turbo_input_url_value: update_path }, required: @champ.required?, class: "width-33-desktop"))
+= @form.text_field(:value, input_opts(id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, data: { controller: 'turbo-input format', format: 'siret', turbo_input_load_on_connect_value: @champ.prefilled? && @champ.value.present? && @champ.etablissement.blank?, turbo_input_url_value: update_path }, required: @champ.required?, class: "width-33-desktop"))
 .siret-info{ id: dom_id(@champ, :siret_info) }
   - if @champ.etablissement.present?
     = render EditableChamp::EtablissementTitreComponent.new(etablissement: @champ.etablissement)

app/components/editable_champ/textarea_component/textarea_component.html.haml

@@ -1,4 +1,4 @@
-~ @form.text_area(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, rows: 6, required: @champ.required?, value: html_to_string(@champ.value), data: { controller: 'autoresize' }))
+~ @form.text_area(:value, input_opts(id: @champ.input_id, aria: { describedby: "#{@champ.describedby_id} #{@champ.error_id}" }, rows: 6, required: @champ.required?, value: html_to_string(@champ.value), data: { controller: 'autoresize' }))
 
 - if @champ.character_limit_info?
   %p.fr-info-text