Refactor showInputOnErrorFields

This function requires a refactor after incorporating new logic

src/registrar/assets/js/get-gov.js

@@ -919,36 +919,43 @@ function hideDeletedForms() {
   }
 
   function showInputOnErrorFields(){
-    let fullNameButtonClicked = false
     document.addEventListener('DOMContentLoaded', function() {
-      document.querySelectorAll('[id$="__edit-button"]').forEach(function(button) {
+      let form = document.querySelector('.main-content-finish-profile');
-        let fieldIdParts = button.id.split("__")
+      // Get all input elements within the form
-        if (fieldIdParts && fieldIdParts.length > 0){
+      let inputs = form ? form.querySelectorAll('input') : null;
-          let fieldName = fieldIdParts[0]
+      if (!inputs) {
+        return null;
+      }
 
-          // Check if an error message exists for the given field
+      let fullNameButtonClicked = false
-          let errorMessage = document.querySelector(`#id_${fieldName}__error-message`);
+      inputs.forEach(function(input) {
-          if (errorMessage) {
+        let fieldName = input.name;
+        let errorMessage = document.querySelector(`#id_${fieldName}__error-message`);
+        if (!fieldName || !errorMessage) {
+          return null;
+        }
 
-            // Show the input field of the field that errored out 
+        let editButton = document.querySelector(`#${fieldName}__edit-button`);
-            button.click()
+        console.log(`edit button is ${editButton} vs id #${fieldName}__edit-button`)
+        if (editButton){
+          // Show the input field of the field that errored out 
+          editButton.click();
+        }
 
-            // If either the full_name field errors out,
+        // If either the full_name field errors out,
-            // or if any of its associated fields do - show all name related fields.
+        // or if any of its associated fields do - show all name related fields.
-            let nameFields = ["first_name", "middle_name", "last_name"] 
+        let nameFields = ["first_name", "middle_name", "last_name"];
-            if (nameFields.includes(fieldName) && !fullNameButtonClicked){
+        if (nameFields.includes(fieldName) && !fullNameButtonClicked){
-              // Click the full name button if any of its related fields error out
+          // Click the full name button if any of its related fields error out
-              fullNameButton = document.querySelector("#full_name__edit-button")
+          fullNameButton = document.querySelector("#full_name__edit-button");
-              if (fullNameButton) {
+          if (fullNameButton) {
-                fullNameButton.click()
+            fullNameButton.click();
-                fullNameButtonClicked = true
+            fullNameButtonClicked = true;
-              }
-            }
           }
         }
       });  
     });
-  }
+  };
 
   // Hookup all edit buttons to the `handleEditButtonClick` function
   setupListener();

src/registrar/templates/finish_profile_setup.html

@@ -11,7 +11,7 @@
 <div class="grid-container">
     <div class="grid-row grid-gap">
         <div class="tablet:grid-col">
-            <main id="main-content" class="grid-container">
+            <main id="main-content-finish-profile" class="grid-container">
 
                 {% comment %}
                 Form success messages.
@@ -44,7 +44,7 @@
                 <h1>Finish setting up your profile</h1>
 
                 <p>
-                    We <a href="{% public_site_url 'domains/requirements/#what-.gov-domain-registrants-must-do' %}">require</a> 
+                    We <a class="usa-link" href="{% public_site_url 'domains/requirements/#what-.gov-domain-registrants-must-do' %}"  target="_blank">require</a> 
                     that you maintain accurate contact information.
                     The details you provide will only be used to support the administration of .gov and won’t be made public. 
                 </p>
@@ -72,18 +72,20 @@
                                 {% input_with_errors form.first_name %}
                             {% endwith %}
                             
-                            {% with group_classes="usa-form-readonly padding-top-2" %}
+                            {% with  group_classes="usa-form-readonly padding-top-2" %}
                                 {% input_with_errors form.middle_name %}
                             {% endwith %}
                             
-                            {% with group_classes="usa-form-readonly padding-top-2" %}
+                            {% with  group_classes="usa-form-readonly padding-top-2" %}
                                 {% input_with_errors form.last_name %}
                             {% endwith %}
                         </div>
 
                         {# This field doesn't have the readonly button but it has common design elements from it #}
-                        {% with show_readonly=True add_class="display-none" group_classes="usa-form-readonly padding-top-2 bold-usa-label" sublabel_text=email_sublabel_text %}
+                        {% with show_readonly=True group_classes="usa-form-readonly padding-top-2 bold-usa-label" %}
-                            {% input_with_errors form.email %}
+                            {% with target_blank="true" sublabel_text=email_sublabel_text add_class="display-none" %}
+                                {% input_with_errors form.email %}
+                            {% endwith %}
                         {% endwith %}
 
                         {% with show_edit_button=True show_readonly=True group_classes="usa-form-readonly padding-top-2" %}

src/registrar/views/utility/mixins.py

@@ -400,7 +400,7 @@ class UserProfilePermission(PermissionsLoginMixin):
             return False
 
         # If we are given a pk in the request, do checks on it
-        given_contact_pk = self.kwargs["pk"]
+        given_contact_pk = self.kwargs.get("pk", None)
 
         if given_contact_pk:
             # Grab the user in the DB to do a full object comparision, not just on ids