From 4a1dad9a66c6b783e619c25304c781e1ee550db4 Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Mon, 20 Nov 2017 16:30:51 +0000
Subject: [PATCH] Hide form legend on choose reply page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The `<h1>` on this page says all the user needs to know. In research
we saw that users didn’t even read the legend, even when prompted to!
---
 app/templates/components/radios.html          | 7 +++++--
 app/templates/views/templates/set-sender.html | 8 ++++----
 tests/app/main/views/test_send.py             | 4 +++-
 3 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/app/templates/components/radios.html b/app/templates/components/radios.html
index d5d3682ea..b6149fa6b 100644
--- a/app/templates/components/radios.html
+++ b/app/templates/components/radios.html
@@ -2,12 +2,15 @@
   field,
   hint=None,
   disable=[],
-  option_hints={}
+  option_hints={},
+  hide_legend=False
 ) %}
   <div class="form-group {% if field.errors %} form-group-error{% endif %}">
     <fieldset>
       <legend class="form-label">
-        {{ field.label.text|safe }}
+        {% if hide_legend %}<span class="visually-hidden">{% endif %}
+          {{ field.label.text|safe }}
+        {% if hide_legend %}</span>{% endif %}
         {% if field.errors %}
           <span class="error-message" data-module="track-error" data-error-type="{{ field.errors[0] }}" data-error-label="{{ field.name }}">
             {{ field.errors[0] }}
diff --git a/app/templates/views/templates/set-sender.html b/app/templates/views/templates/set-sender.html
index 363499dac..5397cdf7e 100644
--- a/app/templates/views/templates/set-sender.html
+++ b/app/templates/views/templates/set-sender.html
@@ -13,10 +13,10 @@
     <div class="column-three-quarters">
       <form method="post">
         {{ radios(
-          form.sender, 
-          option_hints=option_hints
-          ) 
-        }}
+          form.sender,
+          option_hints=option_hints,
+          hide_legend=True
+        ) }}
         {{ page_footer(
           'Continue',
           back_link=url_for('.view_template', service_id=current_service.id, template_id=template_id),
diff --git a/tests/app/main/views/test_send.py b/tests/app/main/views/test_send.py
index 3ae9666b0..38fe48f3e 100644
--- a/tests/app/main/views/test_send.py
+++ b/tests/app/main/views/test_send.py
@@ -74,7 +74,9 @@ def test_show_correct_title_and_description_for_sender_type(
     )
 
     assert page.select_one('h1').text == expected_title
-    assert normalize_spaces(page.select_one('legend').text) == expected_description
+
+    for element in ('legend', 'legend .visually-hidden'):
+        assert normalize_spaces(page.select_one(element).text) == expected_description
 
 
 @pytest.mark.parametrize('template_mock, sender_data', [