Merge pull request #5317 from betagouv/confirm-token

Usager : amélioration de l'accessibilité de la page de confirmation de l'adresse email

app/assets/stylesheets/new_design/confirmations.scss

@@ -37,7 +37,8 @@
   }
 
   .confirmation-resend {
-    p {
+    p,
+    label {
       margin-bottom: $default-padding;
     }
 
@@ -45,6 +46,10 @@
       display: flex;
       flex-wrap: wrap;
 
+      label {
+        flex-basis: 100%;
+      }
+
       input,
       button {
         margin-bottom: $default-spacer;
@@ -56,9 +61,5 @@
         margin-right: $default-spacer;
       }
     }
-
-    label {
-      display: none;
-    }
   }
 }

app/views/users/confirmations/new.html.haml

@@ -1,4 +1,4 @@
-- content_for(:title, 'Confirmer votre adresse email')
+- content_for(:title, 'Confirmez votre adresse email')
 
 - content_for :footer do
   = render partial: 'root/footer'
@@ -6,8 +6,9 @@
 .container.devise-container.devise-confirmations
   .one-column-centered
     = devise_error_messages!
+    %h1.center Confirmez votre adresse email
 
-    %img.confirmation-icon{ src: image_url("user/confirmation-email.svg"), alt: "" }
+    %img.confirmation-icon{ src: image_url("user/confirmation-email.svg"), alt: "Email envoyé" }
 
     %p.confirmation-preamble
       = succeed '.' do
@@ -26,7 +27,8 @@
       %p Si vous n’avez pas reçu notre message (avez-vous vérifié les indésirables ?), nous pouvons vous le renvoyer.
 
       = form_for(resource, as: resource_name, url: confirmation_path(resource_name), html: { class: 'form' }) do |f|
-        = f.label :email, 'Email'
+        = f.label :email, 'Votre email'
+        %br
         = f.email_field :email, placeholder: 'Email', class: 'small', autofocus: true
         = f.submit 'Renvoyer un email de confirmation', class: 'button'
 

spec/features/accessibilite/wcag_usager_spec.rb

@@ -22,7 +22,7 @@ feature 'wcag rules for usager', js: true do
 
       perform_enqueued_jobs do
         click_button 'Créer un compte'
-        expect(page).to be_accessible.skipping(:'page-has-heading-one', :'role-img-alt', :label)
+        expect(page).to be_accessible
       end
     end