Merge pull request #1682 from GSA/1680-update-mem-date-id

1680 update mem date

benefit-finder/cypress/e2e/storybook/dataLayer.cy.js

@@ -501,7 +501,7 @@ describe('Calls to Google Analytics Object', function () {
     })
   })
 
-  it.only('results page with not eligible benefits has a bf_page_change and bf_count events', function () {
+  it('results page with not eligible benefits has a bf_page_change and bf_count events', function () {
     cy.visit(`${utils.storybookUri}${scenario}`)
 
     cy.window().then(window => {

benefit-finder/cypress/e2e/storybook/openAllAccordions.cy.js

@@ -64,7 +64,7 @@ describe('open all interaction tests', () => {
       })
   })
 
-  it.only('from the not eligible view, validate clicking open all expands the accordions, then toggling eligible view, sets them back to close', () => {
+  it('from the not eligible view, validate clicking open all expands the accordions, then toggling eligible view, sets them back to close', () => {
     // make sure all the accordions on not eligible view are closed
     // eslint-disable-next-line cypress/no-unnecessary-waiting
     cy.wait(1000) // TODO: figure out why we have to wait here

benefit-finder/cypress/support/pageObjects.js

@@ -10,39 +10,39 @@ class PageObjects {
   }
 
   applicantDateOfBirthMonth() {
-    return cy.get('#applicant_date_of_birth_0-date_of_birth_month')
+    return cy.get('#applicant_date_of_birth_0_month')
   }
 
   applicantDateOfBirthDay() {
-    return cy.get('#applicant_date_of_birth_0-date_of_birth_day')
+    return cy.get('#applicant_date_of_birth_0_day')
   }
 
   applicantDateOfBirthYear() {
-    return cy.get('#applicant_date_of_birth_0-date_of_birth_year')
+    return cy.get('#applicant_date_of_birth_0_year')
   }
 
   applicantDateOfDeathMonth() {
-    return cy.get('#deceased_date_of_death_0-date_of_birth_month')
+    return cy.get('#deceased_date_of_death_0_month')
   }
 
   applicantDateOfDeathDay() {
-    return cy.get('#deceased_date_of_death_0-date_of_birth_day')
+    return cy.get('#deceased_date_of_death_0_day')
   }
 
   applicantDateOfDeathYear() {
-    return cy.get('#deceased_date_of_death_0-date_of_birth_year')
+    return cy.get('#deceased_date_of_death_0_year')
   }
 
   applicantDateOfFuneralMonth() {
-    return cy.get('#deceased_date_of_funeral_0-date_of_birth_month')
+    return cy.get('#deceased_date_of_funeral_0_month')
   }
 
   applicantDateOfFuneralDay() {
-    return cy.get('#deceased_date_of_funeral_0-date_of_birth_day')
+    return cy.get('#deceased_date_of_funeral_0_day')
   }
 
   applicantDateOfFuneralYear() {
-    return cy.get('#deceased_date_of_funeral_0-date_of_birth_year')
+    return cy.get('#deceased_date_of_funeral_0_year')
   }
 
   benefitSectionAlert() {

benefit-finder/src/shared/components/Date/__tests__/__snapshots__/index.spec.jsx.snap

@@ -14,7 +14,7 @@ exports[`Date > renders a match to the previous snapshot 1`] = `
     >
       <label
         class="bf-usa-label usa-label"
-        for="applicant_date_of_birth_0-date_of_birth_month"
+        for="applicant_date_of_birth_0_month"
       >
         Month
       </label>
@@ -30,8 +30,8 @@ exports[`Date > renders a match to the previous snapshot 1`] = `
         class="bf-usa-select usa-select "
         data-datetype="month"
         data-errormessage="Fill out the undefined month field"
-        id="applicant_date_of_birth_0-date_of_birth_month"
-        name="applicant_date_of_birth_0-date_of_birth_month"
+        id="applicant_date_of_birth_0_month"
+        name="applicant_date_of_birth_0_month"
       >
         <option
           disabled=""
@@ -106,7 +106,7 @@ exports[`Date > renders a match to the previous snapshot 1`] = `
     >
       <label
         class="bf-usa-label usa-label"
-        for="applicant_date_of_birth_0-date_of_birth_day"
+        for="applicant_date_of_birth_0_day"
       >
         Day
       </label>
@@ -122,9 +122,9 @@ exports[`Date > renders a match to the previous snapshot 1`] = `
         class="bf-usa-input usa-input "
         data-datetype="day"
         data-errormessage="Fill out the undefined day field"
-        id="applicant_date_of_birth_0-date_of_birth_day"
+        id="applicant_date_of_birth_0_day"
         inputmode="numeric"
-        name="applicant_date_of_birth_0-date_of_birth_day"
+        name="applicant_date_of_birth_0_day"
         value=""
       />
     </div>
@@ -133,7 +133,7 @@ exports[`Date > renders a match to the previous snapshot 1`] = `
     >
       <label
         class="bf-usa-label usa-label"
-        for="applicant_date_of_birth_0-date_of_birth_year"
+        for="applicant_date_of_birth_0_year"
       >
         Year
       </label>
@@ -149,9 +149,9 @@ exports[`Date > renders a match to the previous snapshot 1`] = `
         class="bf-usa-input usa-input "
         data-datetype="year"
         data-errormessage="Fill out the undefined year field"
-        id="applicant_date_of_birth_0-date_of_birth_year"
+        id="applicant_date_of_birth_0_year"
         inputmode="numeric"
-        name="applicant_date_of_birth_0-date_of_birth_year"
+        name="applicant_date_of_birth_0_year"
         value=""
       />
     </div>

benefit-finder/src/shared/components/Date/index.jsx

@@ -49,7 +49,7 @@ const Date = ({
   return (
     <>
       <ul className="add-list-reset">
-        {handleInvalid(invalid, `${id}-date_of_birth_month`) && (
+        {handleInvalid(invalid, `${id}_month`) && (
           <li
             id={`month-error-description-${id}`}
             className="bf-error-detail"
@@ -58,7 +58,7 @@ const Date = ({
             {errorMessages.month}
           </li>
         )}
-        {handleInvalid(invalid, `${id}-date_of_birth_day`) && (
+        {handleInvalid(invalid, `${id}_day`) && (
           <li
             id={`day-error-description-${id}`}
             className="bf-error-detail"
@@ -67,7 +67,7 @@ const Date = ({
             {errorMessages.day}
           </li>
         )}
-        {handleInvalid(invalid, `${id}-date_of_birth_year`) && (
+        {handleInvalid(invalid, `${id}_year`) && (
           <li
             id={`year-error-description-${id}`}
             className="bf-error-detail"
@@ -82,23 +82,20 @@ const Date = ({
         className="bf-usa-memorable-date usa-memorable-date"
       >
         <div className="bf-usa-form-group usa-form-group bf-usa-form-group--month usa-form-group--month bf-usa-form-group--select usa-form-group--select">
-          <label
-            className="bf-usa-label usa-label"
-            htmlFor={`${id}-date_of_birth_month`}
-          >
+          <label className="bf-usa-label usa-label" htmlFor={`${id}_month`}>
             {labelMonth}
           </label>
           <div id={`${id}-month-description`} className="usa-sr-only">
             Select a month from the list
           </div>
           <select
-            className={`bf-usa-select usa-select ${handleInvalid(invalid, `${id}-date_of_birth_month`) ? 'usa-input--error' : ''}`}
-            id={`${id}-date_of_birth_month`}
-            name={`${id}-date_of_birth_month`}
+            className={`bf-usa-select usa-select ${handleInvalid(invalid, `${id}_month`) ? 'usa-input--error' : ''}`}
+            id={`${id}_month`}
+            name={`${id}_month`}
             aria-describedby={`${id}-month-description`}
             value={(value && value.month) || ''}
             onChange={onChange}
-            aria-invalid={handleInvalid(invalid, `${id}-date_of_birth_month`)}
+            aria-invalid={handleInvalid(invalid, `${id}_month`)}
             data-errormessage={errorMessages.month}
             aria-errormessage={`month-error-description-${id}`}
             data-datetype="month"
@@ -114,48 +111,42 @@ const Date = ({
           </select>
         </div>
         <div className="bf-usa-form-group usa-form-group bf-usa-form-group--day usa-form-group--day">
-          <label
-            className="bf-usa-label usa-label"
-            htmlFor={`${id}-date_of_birth_day`}
-          >
+          <label className="bf-usa-label usa-label" htmlFor={`${id}_day`}>
             {labelDay}
           </label>
           <div id={`${id}-day-description`} className="usa-sr-only">
             Enter two numerals for day
           </div>
           <input
-            className={`bf-usa-input usa-input ${handleInvalid(invalid, `${id}-date_of_birth_day`) ? 'usa-input--error' : ''}`}
+            className={`bf-usa-input usa-input ${handleInvalid(invalid, `${id}_day`) ? 'usa-input--error' : ''}`}
             aria-describedby={`${id}-day-description`}
-            id={`${id}-date_of_birth_day`}
-            name={`${id}-date_of_birth_day`}
+            id={`${id}_day`}
+            name={`${id}_day`}
             inputMode="numeric"
             value={(value && value.day) || ''}
             onChange={onChange}
-            aria-invalid={handleInvalid(invalid, `${id}-date_of_birth_day`)}
+            aria-invalid={handleInvalid(invalid, `${id}_day`)}
             data-errormessage={errorMessages.day}
             aria-errormessage={`day-error-description-${id}`}
             data-datetype="day"
           />
         </div>
         <div className="bf-usa-form-group usa-form-group bf-usa-form-group--year usa-form-group--year">
-          <label
-            className="bf-usa-label usa-label"
-            htmlFor={`${id}-date_of_birth_year`}
-          >
+          <label className="bf-usa-label usa-label" htmlFor={`${id}_year`}>
             {labelYear}
           </label>
           <div id={`${id}-year-description`} className="usa-sr-only">
             Enter four numerals for year
           </div>
           <input
-            className={`bf-usa-input usa-input ${handleInvalid(invalid, `${id}-date_of_birth_year`) ? 'usa-input--error' : ''}`}
+            className={`bf-usa-input usa-input ${handleInvalid(invalid, `${id}_year`) ? 'usa-input--error' : ''}`}
             aria-describedby={`${id}-year-description`}
-            id={`${id}-date_of_birth_year`}
-            name={`${id}-date_of_birth_year`}
+            id={`${id}_year`}
+            name={`${id}_year`}
             inputMode="numeric"
             value={(value && value.year) || ''}
             onChange={onChange}
-            aria-invalid={handleInvalid(invalid, `${id}-date_of_birth_year`)}
+            aria-invalid={handleInvalid(invalid, `${id}_year`)}
             data-errormessage={errorMessages.year}
             aria-errormessage={`year-error-description-${id}`}
             data-datetype="year"

benefit-finder/src/shared/components/LifeEventSection/__tests__/__snapshots__/index.spec.jsx.snap

@@ -153,7 +153,7 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                 >
                   <label
                     class="bf-usa-label usa-label"
-                    for="applicant_date_of_birth_0-date_of_birth_month"
+                    for="applicant_date_of_birth_0_month"
                   >
                     Month
                   </label>
@@ -170,8 +170,8 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                     class="bf-usa-select usa-select "
                     data-datetype="month"
                     data-errormessage="Fill out the date of birth month field"
-                    id="applicant_date_of_birth_0-date_of_birth_month"
-                    name="applicant_date_of_birth_0-date_of_birth_month"
+                    id="applicant_date_of_birth_0_month"
+                    name="applicant_date_of_birth_0_month"
                   >
                     <option
                       disabled=""
@@ -246,7 +246,7 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                 >
                   <label
                     class="bf-usa-label usa-label"
-                    for="applicant_date_of_birth_0-date_of_birth_day"
+                    for="applicant_date_of_birth_0_day"
                   >
                     Day
                   </label>
@@ -263,9 +263,9 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                     class="bf-usa-input usa-input "
                     data-datetype="day"
                     data-errormessage="Fill out the date of birth day field"
-                    id="applicant_date_of_birth_0-date_of_birth_day"
+                    id="applicant_date_of_birth_0_day"
                     inputmode="numeric"
-                    name="applicant_date_of_birth_0-date_of_birth_day"
+                    name="applicant_date_of_birth_0_day"
                     value=""
                   />
                 </div>
@@ -274,7 +274,7 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                 >
                   <label
                     class="bf-usa-label usa-label"
-                    for="applicant_date_of_birth_0-date_of_birth_year"
+                    for="applicant_date_of_birth_0_year"
                   >
                     Year
                   </label>
@@ -291,9 +291,9 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                     class="bf-usa-input usa-input "
                     data-datetype="year"
                     data-errormessage="Fill out the date of birth year field"
-                    id="applicant_date_of_birth_0-date_of_birth_year"
+                    id="applicant_date_of_birth_0_year"
                     inputmode="numeric"
-                    name="applicant_date_of_birth_0-date_of_birth_year"
+                    name="applicant_date_of_birth_0_year"
                     value=""
                   />
                 </div>