Merge pull request #1746 from GSA/1737-date-validation-not-required

1737 date validation not required
GSA · Aug 30, 2024 · 33c9964 · 33c9964
2 parents f09828f + 55da7fe
commit 33c9964
Show file tree

Hide file tree

Showing 9 changed files with 89 additions and 31 deletions.
diff --git a/benefit-finder/src/shared/components/Date/__tests__/__snapshots__/index.spec.jsx.snap b/benefit-finder/src/shared/components/Date/__tests__/__snapshots__/index.spec.jsx.snap
@@ -34,7 +34,6 @@ exports[`Date > renders a match to the previous snapshot 1`] = `
         name="applicant_date_of_birth_0_month"
       >
         <option
-          disabled=""
           value=""
         >
           -Select-

diff --git a/benefit-finder/src/shared/components/Date/index.jsx b/benefit-finder/src/shared/components/Date/index.jsx
@@ -103,7 +103,7 @@ const Date = ({
             aria-errormessage={`month-error-description-${id}`}
             data-datetype="month"
           >
-            <option value="" key="default" disabled>
+            <option value="" key="default">
               {dateDefaultValue}
             </option>
             {monthOptions.map((option, i) => (
@@ -165,7 +165,7 @@ Date.propTypes = {
   value: PropTypes.object,
   ui: PropTypes.object,
   id: PropTypes.string,
-  invalid: PropTypes.array,
+  invalid: PropTypes.oneOfType([PropTypes.bool, PropTypes.array]),
 }
 
 export default Date
diff --git a/...finder/src/shared/components/LifeEventSection/__tests__/__snapshots__/index.spec.jsx.snap b/...finder/src/shared/components/LifeEventSection/__tests__/__snapshots__/index.spec.jsx.snap
@@ -175,7 +175,6 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                     name="applicant_date_of_birth_0_month"
                   >
                     <option
-                      disabled=""
                       value=""
                     >
                       -Select-
@@ -338,7 +337,6 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                 name="applicant_relationship_to_the_deceased_0"
               >
                 <option
-                  disabled=""
                   value=""
                 >
                   -Select-
@@ -408,7 +406,6 @@ exports[`LifeEventSection > renders a match to the previous snapshot 1`] = `
                 name="applicant_marital_status_0"
               >
                 <option
-                  disabled=""
                   value=""
                 >
                   -Select-

diff --git a/benefit-finder/src/shared/components/LifeEventSection/index.jsx b/benefit-finder/src/shared/components/LifeEventSection/index.jsx
@@ -203,22 +203,37 @@ const LifeEventSection = ({
    * @return {object} object as state
    */
   const handleDateChanged = (event, criteriaKey) => {
+    // if event target is empty check if all values in date are empty
     event.target.value.length > 0 && setHasData(true)
     window.history.replaceState({}, '', window.location.pathname)
-    if (dateInputValidation(event) === true) {
-      apiCalls.PUT.DataDate(
-        criteriaKey,
-        currentData,
-        setCurrentData,
-        event.target.value,
-        event.target.id
-      )
-      hasError.length > 0 &&
-        errorHandling.handleCheckForRequiredValues(
-          requiredFieldsets,
-          setHasError
+
+    async function validUpdate() {
+      if (dateInputValidation(event) === true) {
+        apiCalls.PUT.DataDate(
+          criteriaKey,
+          currentData,
+          setCurrentData,
+          event.target.value,
+          event.target.id
         )
+        hasError.length > 0 &&
+          errorHandling.handleCheckForRequiredValues(
+            requiredFieldsets,
+            setHasError
+          )
+      }
     }
+
+    validUpdate().then(() => {
+      errorHandling.getNonRequiredFieldsets(
+        criteriaKey,
+        requiredFieldsets,
+        setRequiredFieldsets,
+        setHasError,
+        hasError,
+        apiCalls.GET.SelectedValueAll(data)
+      )
+    })
   }
 
   // manage the display of our modal initializer
@@ -316,7 +331,6 @@ const LifeEventSection = ({
                           hidden={hidden && hidden}
                           id={item.fieldset.criteriaKey}
                           invalid={errorHandling.handleInvalid({
-                            required: item.fieldset.required,
                             hasError,
                             criteriaKey: item.fieldset?.criteriaKey,
                           })}
@@ -346,7 +360,6 @@ const LifeEventSection = ({
                                     )
                                   }
                                   invalid={errorHandling.handleInvalid({
-                                    required: item.fieldset.required,
                                     hasError,
                                     criteriaKey: item.fieldset?.criteriaKey,
                                     fieldSetId,
@@ -385,14 +398,12 @@ const LifeEventSection = ({
                               hidden={hidden && hidden}
                               ui={ui.errorText}
                               invalid={errorHandling.handleInvalid({
-                                required: item.fieldset.required,
                                 hasError,
                                 criteriaKey: item.fieldset?.criteriaKey,
                               })}
                             >
                               <RadioGroup
                                 invalid={errorHandling.handleInvalid({
-                                  required: item.fieldset.required,
                                   hasError,
                                   criteriaKey: item.fieldset?.criteriaKey,
                                 })}
@@ -430,7 +441,6 @@ const LifeEventSection = ({
                           hidden={hidden && hidden}
                           id={item.fieldset.criteriaKey}
                           invalid={errorHandling.handleInvalid({
-                            required: item.fieldset.required,
                             hasError,
                             criteriaKey: item.fieldset?.criteriaKey,
                           })}
@@ -454,7 +464,6 @@ const LifeEventSection = ({
                                   parentLegend={item.fieldset.legend}
                                   id={fieldSetId}
                                   invalid={errorHandling.handleInvalid({
-                                    required: item.fieldset.required,
                                     hasError,
                                     criteriaKey: item.fieldset?.criteriaKey,
                                     fieldSetId,

diff --git a/benefit-finder/src/shared/components/Select/__tests__/__snapshots__/index.spec.jsx.snap b/benefit-finder/src/shared/components/Select/__tests__/__snapshots__/index.spec.jsx.snap
@@ -17,7 +17,6 @@ exports[`Select > renders a match to the previous snapshot 1`] = `
     name="applicant_relationship_to_the_deceased"
   >
     <option
-      disabled=""
       value=""
     />
     <option

diff --git a/benefit-finder/src/shared/components/Select/index.jsx b/benefit-finder/src/shared/components/Select/index.jsx
@@ -69,7 +69,7 @@ function Select({
         data-errormessage={errorMessageValue}
         aria-errormessage={`error-description-${htmlFor}`}
       >
-        <option value="" key="default" disabled>
+        <option value="" key="default">
           {select?.defaultValue}
         </option>
         <Options options={options} />

diff --git a/benefit-finder/src/shared/utils/dateInputValidation/__tests__/index.spec.jsx b/benefit-finder/src/shared/utils/dateInputValidation/__tests__/index.spec.jsx
@@ -23,14 +23,14 @@ test('month value should be determined if valid', async () => {
       id: monthElement.id,
     },
   }
+
+  expect(dateInputValidation(customEvent)).toBe(true)
 })
 
 test('day value should be determined if valid', async () => {
   render(<IndexHTML />)
   const dayElement = screen.getByTestId('input-day')
 
-  expect(dateInputValidation(customEvent)).toBe(false)
-
   customEvent = {
     target: {
       value: '33',
@@ -46,6 +46,8 @@ test('day value should be determined if valid', async () => {
       id: dayElement.id,
     },
   }
+
+  expect(dateInputValidation(customEvent)).toBe(true)
 })
 
 test('year value should be determined if valid', async () => {

diff --git a/benefit-finder/src/shared/utils/dateInputValidation/index.js b/benefit-finder/src/shared/utils/dateInputValidation/index.js
@@ -21,8 +21,9 @@ const dateInputValidation = event => {
     }
   }
 
+  // always return true for month values so we can select default options
   if (event.target.id.includes('month')) {
-    return event.target.value.length >= 1
+    return true
   }
 }
 

diff --git a/benefit-finder/src/shared/utils/errorHandling/index.js b/benefit-finder/src/shared/utils/errorHandling/index.js
@@ -1,3 +1,5 @@
+// import * as apiCalls from '../../api/apiCalls'
+
 /**
  * a function that collect all the required fields in the current step
  * @function
@@ -10,6 +12,54 @@ export const getRequiredFieldsets = (document, setHandler) => {
   setHandler(Array.from(requiredNodeList))
 }
 
+/**
+ * a function that collect all the non required fields in the current step which still need to be validated if there are requirements
+ * @function
+ */
+
+// if a date fieldset has values, add it to required fieldsets array even if not attributed as required
+export const getNonRequiredFieldsets = (
+  criteriaKey,
+  requiredFieldsets,
+  setHandler,
+  setHasError,
+  hasError,
+  data
+) => {
+  const node = document.getElementById(`${criteriaKey}`)
+
+  const dateDataObj = data.filter(item => item.criteriaKey === criteriaKey)
+
+  const dateValues = dateDataObj[0].values.value
+
+  const isEmpty = obj => {
+    for (const key in obj) {
+      if (obj[key] !== '') {
+        return false // returns false if object has a non-empty string value
+      }
+    }
+    return true // returns true if all values are empty strings
+  }
+
+  const addToRequiredFields = [...requiredFieldsets, node]
+
+  const makeUniq = [...new Set(addToRequiredFields)]
+
+  const removeFromRequiredFields = makeUniq.filter(
+    item => !item.id === criteriaKey
+  )
+
+  const removeFromErrorArray = hasError.filter(
+    item => !item.id.includes(criteriaKey)
+  )
+
+  isEmpty(dateValues) && setHasError(removeFromErrorArray)
+
+  isEmpty(dateValues)
+    ? setHandler(removeFromRequiredFields)
+    : setHandler(makeUniq)
+}
+
 export const handleCheckForRequiredValues = async (
   requiredFieldsets,
   setHasError
@@ -64,7 +114,7 @@ export const handleCheckForRequiredValues = async (
 }
 
 export const handleInvalid = ({
-  required,
+  // required,
   hasError,
   criteriaKey,
   fieldSetId,
@@ -85,11 +135,12 @@ export const handleInvalid = ({
     return errorItem.id !== undefined && errorItem.id.includes(fieldSetId)
   })
 
-  return required && useFilter === true ? hanldeFilter : handleMap
+  return useFilter === true ? hanldeFilter : handleMap
 }
 
 export default {
   getRequiredFieldsets,
+  getNonRequiredFieldsets,
   handleCheckForRequiredValues,
   handleInvalid,
 }
-Original file line number
+Diff line change
@@ Expand Up @@
             name="applicant_date_of_birth_0_month"
           >
             <option
-              disabled=""
               value=""
             >
               -Select-
@@ Expand Down @@