fix(DatePicker): throw error when date is invalid

dnbexperience · Dec 12, 2024 · fb54ba9 · fb54ba9
1 parent d2fc5a7
commit fb54ba9
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 3 deletions.
diff --git a/packages/dnb-eufemia/src/components/date-picker/__tests__/DatePicker.test.tsx b/packages/dnb-eufemia/src/components/date-picker/__tests__/DatePicker.test.tsx
@@ -1413,6 +1413,7 @@ describe('DatePicker component', () => {
     expect(onChange.mock.calls[4][0].date).toBe('2019-01-03')
     expect(onChange.mock.calls[4][0].is_valid).toBe(true)
   })
+
   it('has to auto-correct invalid min/max dates', async () => {
     const onChange = jest.fn()
 
@@ -1455,6 +1456,31 @@ describe('DatePicker component', () => {
     )
   })
 
+  it('has to auto-correct invalid date based on min date', async () => {
+    render(
+      <DatePicker
+        {...defaultProps}
+        date="2022-01-01"
+        correctInvalidDate
+        minDate="2024-12-12"
+      />
+    )
+
+    const dayElem = document.querySelectorAll(
+      'input.dnb-date-picker__input--day'
+    )[0] as HTMLInputElement
+    const monthElem = document.querySelectorAll(
+      'input.dnb-date-picker__input--month'
+    )[0] as HTMLInputElement
+    const yearElem = document.querySelectorAll(
+      'input.dnb-date-picker__input--year'
+    )[0] as HTMLInputElement
+
+    expect(dayElem.value).toBe('12')
+    expect(monthElem.value).toBe('12')
+    expect(yearElem.value).toBe('2024')
+  })
+
   it('has valid on_type and onChange event calls', () => {
     const onType = jest.fn()
     const onChange = jest.fn()

diff --git a/packages/dnb-eufemia/src/components/date-picker/hooks/useDates.ts b/packages/dnb-eufemia/src/components/date-picker/hooks/useDates.ts
@@ -231,9 +231,6 @@ function mapDates(
     dateFormat,
   })
 
-  const hasValidStartDate = isValid(startDate)
-  const hasValidEndDate = isValid(endDate)
-
   const correctedDates = shouldCorrectDate
     ? correctDates({ startDate, endDate, minDate, maxDate, isRange })
     : {}
@@ -249,6 +246,9 @@ function mapDates(
     ...correctedDates,
   }
 
+  const hasValidStartDate = isValid(dates.startDate)
+  const hasValidEndDate = isValid(dates.endDate)
+
   return {
     ...dates,
     __startDay: hasValidStartDate

diff --git a/packages/dnb-eufemia/src/components/date-picker/stories/DatePicker.stories.tsx b/packages/dnb-eufemia/src/components/date-picker/stories/DatePicker.stories.tsx
@@ -552,6 +552,7 @@ export const GlobalStatusExample = () => {
 export const CorrectInvalidDateExample = () => {
   return (
     <DatePicker
+      show_input
       date="2022-01-01"
       correctInvalidDate
       minDate={new Date()}