fix(date-picker): stabilize defaultDate behavior (#13186)

* fix(date-picker): stabiliz defaultDate behavior * Ignore time in date objects when comparing for equality to prevent overrides * clear input values on rerender when value prop is set to prevent overrides * Add test story (to be deleted) * fix(date-picker): re-add simple storybook * chore(date-picker): remove test story --------- Co-authored-by: Alison Joseph <[email protected]>
carbon-design-system · Feb 24, 2023 · 2ca3000 · 2ca3000
1 parent 0ab5fc1
commit 2ca3000
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/packages/react/src/components/DatePicker/DatePicker.js b/packages/react/src/components/DatePicker/DatePicker.js
@@ -449,6 +449,17 @@ const DatePicker = React.forwardRef(function DatePicker(
         calendar.destroy();
       }
 
+      // prevent a duplicate date selection when a default value is set
+      if (value) {
+        if (startInputField?.current) {
+          startInputField.current.value = '';
+        }
+        if (endInputField?.current) {
+          // eslint-disable-next-line react-hooks/exhaustive-deps
+          endInputField.current.value = '';
+        }
+      }
+
       if (start) {
         start.removeEventListener('keydown', handleArrowDown);
         start.removeEventListener('change', handleOnChange);

diff --git a/packages/react/src/components/DatePicker/plugins/fixEventsPlugin.js b/packages/react/src/components/DatePicker/plugins/fixEventsPlugin.js
@@ -59,8 +59,8 @@ export default (config) => (fp) => {
     if (inputTo === target && fp.selectedDates[1]) {
       // Using getTime() enables the ability to more readily compare the date currently
       // selected in the calendar and the date currently in the value of the input
-      const selectedToDate = new Date(fp.selectedDates[1]).getTime();
-      const currentValueToDate = new Date(inputTo.value).getTime();
+      const selectedToDate = new Date(fp.selectedDates[1]).setHours(0, 0, 0, 0);
+      const currentValueToDate = new Date(inputTo.value).setHours(0, 0, 0, 0);
 
       // The date should only be set if both dates are valid dates, and they don't match.
       // When they don't match, this indiciates that the date selected in the calendar is stale,