Merge branch 'preview-skip-link'

app/templates/views/check.html

@@ -7,6 +7,13 @@
 {% from "components/list.html" import formatted_list %}
 {% from "components/message-count-label.html" import message_count_label %}
 
+{% set file_contents_header_id = 'file-preview' %}
+{% macro skip_to_file_contents() %}
+  <p class="visually-hidden">
+    <a href="#{{ file_contents_header_id }}">Skip to file contents</a>
+  </p>
+{% endmacro %}
+
 {% block page_title %}
   {{ "Error" if errors else "Preview" }} – GOV.UK Notify
 {% endblock %}
@@ -25,6 +32,7 @@
           {{ "{:,}".format(recipients.max_rows) }} rows at once. Your
           file has {{ "{:,}".format(recipients|length) }} rows.
         </p>
+        {{ skip_to_file_contents() }}
       {% endcall %}
     </div>
 
@@ -42,6 +50,7 @@
             prefix_plural='columns called'
           ) }}.
         </p>
+        {{ skip_to_file_contents() }}
       {% endcall %}
     </div>
 
@@ -68,6 +77,7 @@
             prefix_plural='columns called'
           ) }}.
         </p>
+        {{ skip_to_file_contents() }}
       {% endcall %}
     </div>
 
@@ -95,6 +105,7 @@
             {% endfor %}
           </ul>
         {% endif %}
+        {{ skip_to_file_contents() }}
       {% endcall %}
     </div>
 
@@ -114,6 +125,7 @@
           In <a href="{{ url_for('.trial_mode') }}">trial mode</a> you can only
           send to yourself and members of your team
         </p>
+        {{ skip_to_file_contents() }}
       {% endcall %}
     </div>
 
@@ -124,11 +136,13 @@
     <h1 class="heading-large">
       Preview
     </h1>
+    {{ skip_to_file_contents() }}
 
   {% endif %}
 
   {{ template|string }}
 
+  <div class="bottom-gutter-3-2">
   {% if errors %}
     {% if request.args.from_test %}
       <a href="{{ back_link }}" class="page-footer-back-link">Back</a>
@@ -149,10 +163,14 @@
       <a href="{{ back_link }}" class="page-footer-back-link">Back</a>
     </form>
   {% endif %}
+  </div>
+
+  <h2 class="heading-medium" id="{{ file_contents_header_id }}">{{ original_file_name }}</h2>
 
   {% call(item, row_number) list_table(
     recipients.initial_annotated_rows_with_errors if row_errors and not recipients.missing_column_headers else recipients.initial_annotated_rows,
     caption=original_file_name,
+    caption_visible=False,
     field_headings=['1'] + recipients.column_headers
   ) %}
     {{ index_field(item.index + 2) }}

tests/app/main/views/test_send.py

@@ -841,7 +841,8 @@ def test_check_messages_shows_trial_mode_error(
         page.find('div', class_='banner-dangerous').text.split()
     ) == (
         'You can’t send to this phone number '
-        'In trial mode you can only send to yourself and members of your team'
+        'In trial mode you can only send to yourself and members of your team '
+        'Skip to file contents'
     )
 
 
@@ -878,7 +879,8 @@ def test_check_messages_shows_over_max_row_error(
     ) == (
         'Your file has too many rows '
         'Notify can process up to 11,111 rows at once. '
-        'Your file has 99,999 rows.'
+        'Your file has 99,999 rows. '
+        'Skip to file contents'
     )