From 4b15da5c6bb0676357d7db01d870728a191e50af Mon Sep 17 00:00:00 2001
From: Xavier Fernandez <xavier.fernandez@beta.gouv.fr>
Date: Mon, 12 Aug 2024 16:58:11 +0200
Subject: [PATCH] accessibility: always include text for copy-to-clipboard
 button

Since the icon is aria-hidden, the button needs to have a content.
---
 itou/templates/includes/copy_to_clipboard.html | 2 +-
 tests/gps/__snapshots__/test_views.ambr        | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/itou/templates/includes/copy_to_clipboard.html b/itou/templates/includes/copy_to_clipboard.html
index c9381bd3bb..18db0df726 100644
--- a/itou/templates/includes/copy_to_clipboard.html
+++ b/itou/templates/includes/copy_to_clipboard.html
@@ -1,4 +1,4 @@
 <button class="{{ css_classes|default:"btn btn-ico" }}" {{ matomo_event_attrs|default:"" }} data-it-clipboard-button="copy" data-it-copy-to-clipboard="{{ content }}" data-bs-toggle="tooltip" data-bs-placement="{{ placement|default:"top" }}" data-bs-trigger="manual" data-bs-title="Copié !">
     <i class="ri-file-copy-line ri-lg font-weight-normal" aria-hidden="true"></i>
-    {% if not only_icon|default:False %}<span>{{ text|default:"Copier" }}</span>{% endif %}
+    <span {% if only_icon|default:False %}class="visually-hidden"{% endif %}>{{ text|default:"Copier" }}</span>
 </button>
diff --git a/tests/gps/__snapshots__/test_views.ambr b/tests/gps/__snapshots__/test_views.ambr
index a12b1a577f..918eb4cd80 100644
--- a/tests/gps/__snapshots__/test_views.ambr
+++ b/tests/gps/__snapshots__/test_views.ambr
@@ -30,7 +30,7 @@
                                           
                                           <button class="btn-link" data-bs-placement="top" data-bs-title="Copié !" data-bs-toggle="tooltip" data-bs-trigger="manual" data-it-clipboard-button="copy" data-it-copy-to-clipboard="jane.doe@test.local" data-matomo-action="clic" data-matomo-category="gps" data-matomo-event="true" data-matomo-option="copied_user_email">
       <i aria-hidden="true" class="ri-file-copy-line ri-lg font-weight-normal"></i>
-      
+      <span class="visually-hidden">Copier</span>
   </button>
   
                                       </li>
@@ -41,7 +41,7 @@
                                               
                                               <button class="btn-link" data-bs-placement="top" data-bs-title="Copié !" data-bs-toggle="tooltip" data-bs-trigger="manual" data-it-clipboard-button="copy" data-it-copy-to-clipboard="0612345678" data-matomo-action="clic" data-matomo-category="gps" data-matomo-event="true" data-matomo-option="copied_user_phone">
       <i aria-hidden="true" class="ri-file-copy-line ri-lg font-weight-normal"></i>
-      
+      <span class="visually-hidden">Copier</span>
   </button>
   
                                           
@@ -120,7 +120,7 @@
                                   
                                   <button class="btn-link" data-bs-placement="top" data-bs-title="Copié !" data-bs-toggle="tooltip" data-bs-trigger="manual" data-it-clipboard-button="copy" data-it-copy-to-clipboard="pierre.dupont@test.local" data-matomo-action="clic" data-matomo-category="gps" data-matomo-event="true" data-matomo-option="copied_member_email">
       <i aria-hidden="true" class="ri-file-copy-line ri-lg font-weight-normal"></i>
-      
+      <span class="visually-hidden">Copier</span>
   </button>
   
                               </li>
@@ -131,7 +131,7 @@
                                       
                                       <button class="btn-link" data-bs-placement="top" data-bs-title="Copié !" data-bs-toggle="tooltip" data-bs-trigger="manual" data-it-clipboard-button="copy" data-it-copy-to-clipboard="0612345678" data-matomo-action="clic" data-matomo-category="gps" data-matomo-event="true" data-matomo-option="copied_member_phone">
       <i aria-hidden="true" class="ri-file-copy-line ri-lg font-weight-normal"></i>
-      
+      <span class="visually-hidden">Copier</span>
   </button>