Add Contact Information page to Form Upload flow (#33377)

src/applications/simple-forms/form-upload/config/form.js

@@ -18,6 +18,7 @@ import {
   VeteranIdentificationInformationPage,
   veteranIdentificationInformationPage,
 } from '../pages/veteranIdentificationInformation';
+import { phoneNumberAndEmailPage } from '../pages/phoneNumberAndEmail';
 import { CustomTopContent } from '../pages/helpers';
 
 // mock-data import for local development
@@ -92,6 +93,18 @@ const formConfig = (pathname = null) => {
           },
         },
       },
+      contactInformationChapter: {
+        title: 'Your contact information',
+        pages: {
+          phoneNumberAndEmailPage: {
+            path: 'phone-number-and-email',
+            title: 'Phone and email address',
+            uiSchema: phoneNumberAndEmailPage.uiSchema,
+            schema: phoneNumberAndEmailPage.schema,
+            scrollAndFocusTarget,
+          },
+        },
+      },
       uploadChapter: {
         title: 'Upload',
         pages: {

src/applications/simple-forms/form-upload/pages/phoneNumberAndEmail.jsx

@@ -0,0 +1,24 @@
+import {
+  emailSchema,
+  emailToSendNotificationsUI,
+  phoneSchema,
+  phoneUI,
+  titleUI,
+} from 'platform/forms-system/src/js/web-component-patterns';
+
+/** @type {PageSchema} */
+export const phoneNumberAndEmailPage = {
+  uiSchema: {
+    ...titleUI('Phone and email address'),
+    phoneNumber: phoneUI(),
+    email: emailToSendNotificationsUI(),
+  },
+  schema: {
+    type: 'object',
+    properties: {
+      phoneNumber: phoneSchema,
+      email: emailSchema,
+    },
+    required: ['email'],
+  },
+};

src/applications/simple-forms/form-upload/tests/e2e/fixtures/data/veteran.json

@@ -11,7 +11,12 @@
       "state": "CA",
       "postalCode": "12345"
     },
-    "idNumber": { "ssn": "234232345", "vaFileNumber": "456454567" },
+    "phoneNumber": "1231231234",
+    "email": "[email protected]",
+    "idNumber": {
+      "ssn": "234232345",
+      "vaFileNumber": "456454567"
+    },
     "uploadedFile": {
       "confirmationCode": "03d52b41-bc92-4830-beda-dfc3c2669af4",
       "name": "Mock File",
@@ -20,4 +25,4 @@
       "warnings": []
     }
   }
-}
+}

src/applications/simple-forms/form-upload/tests/e2e/form-upload.cypress.spec.js

@@ -91,6 +91,17 @@ const testConfig = createTestConfig(
           });
         });
       },
+      'phone-number-and-email': ({ afterHook }) => {
+        afterHook(() => {
+          cy.get('@testData').then(data => {
+            fillTextWebComponent('phoneNumber', data.phoneNumber);
+            fillTextWebComponent('email', data.email);
+            cy.findAllByText(/^Continue/, { selector: 'button' })
+              .last()
+              .click();
+          });
+        });
+      },
       upload: ({ afterHook }) => {
         afterHook(() => {
           cy.axeCheck('.form-panel');