Merge pull request #2206 from GSA/2125-send-message-a11y-audit-unique-ids

Send Message A11Y Audit - Unique IDs and also refactor error message on templates page

app/templates/views/edit-sms-template.html

@@ -29,9 +29,11 @@
 
     {% call form_wrapper() %}
       <div class="grid-row">
-        <div class="tablet:grid-col-9 mobile-lg:grid-col-12">
+        <div class="tablet:grid-col-9 mobile-lg:grid-col-12" aria-live="polite" role="alert">
           {{ form.name(param_extensions={
             "extra_form_group_classes": "margin-bottom-2",
+            "id": "name",
+            "required": True,
             "hint": {"text": "Your recipients will not see this"}
           }) }}
           {{ textbox(
@@ -41,7 +43,8 @@
             hint=content_hint,
             rows=5,
             extra_form_group_classes='margin-bottom-1',
-            placeholder='Edit me! Check out the Personalization section below for details on cool ((stuff)) you can do with your messages!'
+            placeholder='Edit me! Check out the Personalization section below for details on cool ((stuff)) you can do with your messages!',
+            required=True
           ) }}
           {% if current_user.platform_admin %}
             {{ form.process_type }}

app/templates/views/send-test.html

@@ -37,8 +37,8 @@
     data_kwargs={'force-focus': True}
   ) %}
     <div class="grid-row">
-      <div class="grid-col-12 {% if form.placeholder_value.label.text == 'phone number' %}extra-tracking{% endif %}" aria-live="polite" role="alert">
-        {{ form.placeholder_value(param_extensions={"classes": ""}) }}
+      <div class="grid-col-12 {% if form.placeholder_value.label.text == 'phone number' %}extra-tracking{% endif %}">
+        {{ form.placeholder_value(param_extensions={"id": "phone-number"}) }}
       </div>
       {% if skip_link or link_to_upload %}
         <div class="grid-col-12 margin-top-1">

app/templates/views/templates/template.html

@@ -90,8 +90,4 @@
     {% endif %}
   </div>
 
-  <!--<div class="">
-    {{ copy_to_clipboard(template.id, name="Template ID", thing='template ID') }}
-  </div>-->
-
 {% endblock %}