Fix flatpickr#2419 breaking with altInput and altFormat Enabled

Fixes flatpickr#2653, Fixes flatpickr#2660, Refs. flatpickr#2541, flatpickr#2601
mshibuya · Mar 12, 2022 · ea09ebd · ea09ebd
1 parent 5b055df
commit ea09ebd
Show file tree

Hide file tree

Showing 2 changed files with 69 additions and 19 deletions.
diff --git a/__tests__/src/index.spec.ts b/__tests__/src/index.spec.ts
@@ -751,6 +751,41 @@ describe("flatpickr", () => {
         expect(fp.selectedDates[0]).toEqual(new Date("2020-01-22T00:00:00"));
         expect(fp._input.value).toBe("22 January 2020");
       });
+
+      it("should be updated correctly via mouse events when altInput is enabled #2653", () => {
+        createInstance({
+          allowInput: true,
+          altInput: true,
+          altFormat: "j F Y H:i",
+          defaultDate: "2020-01-22 03:04",
+          enableTime: true,
+        });
+
+        expect(fp.selectedDates[0]).toEqual(new Date("2020-01-22T03:04:00"));
+        simulate("focus", fp._input);
+        simulate("mousedown", window.document.body, { which: 1 }, CustomEvent);
+        expect(fp.isOpen).toBe(false);
+        expect(fp._input.value).toBe("22 January 2020 03:04");
+      });
+
+      it("should trigger onChange only once", () => {
+        let timesFired = 0;
+
+        createInstance({
+          allowInput: true,
+          altInput: true,
+          altFormat: "j F Y H:i",
+          enableTime: true,
+          onChange: () => timesFired++,
+        });
+
+        simulate("focus", fp._input);
+        fp._input.value = "22 January 2020 03:04";
+        simulate("mousedown", window.document.body, { which: 1 }, CustomEvent);
+        simulate("blur", fp._input);
+        expect(fp.isOpen).toBe(false);
+        expect(timesFired).toEqual(1);
+      });
     });
 
     it("onKeyDown", () => {
@@ -817,6 +852,29 @@ describe("flatpickr", () => {
       expect(fp.currentYear).toBe(2016);
     });
 
+    it("onKeyDown closes flatpickr on Enter when allowInput set to true", () => {
+      createInstance({
+        enableTime: true,
+        allowInput: true,
+        altInput: true,
+      });
+
+      fp.jumpToDate("2016-2-1");
+
+      fp.open();
+      (fp.days.childNodes[15] as HTMLSpanElement).focus();
+
+      simulate(
+        "keydown",
+        fp._input,
+        {
+          keyCode: 13, // "Enter"
+        },
+        KeyboardEvent
+      );
+      expect(fp.isOpen).toEqual(false);
+    });
+
     it("enabling dates by function", () => {
       createInstance({
         enable: [(d) => d.getDate() === 6, new Date()],
@@ -1830,10 +1888,11 @@ describe("flatpickr", () => {
       it("doesn't misfire", () => {
         let timesFired = 0;
         const fp = createInstance({
+          allowInput: true,
           onChange: () => timesFired++,
         });
         fp._input.focus();
-        document.body.focus();
+        simulate("blur", fp._input);
         expect(timesFired).toEqual(0);
       });
     });

diff --git a/src/index.ts b/src/index.ts
@@ -197,17 +197,12 @@ function FlatpickrInstance(
       timeWrapper(e);
     }
 
-    const valueFromInput = self._input.value;
-    const dateFromInput = self.parseDate(valueFromInput);
-    const latestDate = self.latestSelectedDateObj;
-    if (valueFromInput && latestDate && dateFromInput?.getTime() !== latestDate?.getTime()) {
-      setDate(dateFromInput!);
-    } else {
-      setHoursFromInputs();
-    }
+    const prevValue = self._input.value;
+
+    setHoursFromInputs();
     updateValue();
 
-    if (self._input.value !== valueFromInput) {
+    if (self._input.value !== prevValue) {
       self._debouncedChange();
     }
   }
@@ -1470,13 +1465,9 @@ function FlatpickrInstance(
             ~(e as any).path.indexOf(self.altInput)));
 
       const lostFocus =
-        e.type === "blur"
-          ? isInput &&
-            e.relatedTarget &&
-            !isCalendarElem(e.relatedTarget as HTMLElement)
-          : !isInput &&
-            !isCalendarElement &&
-            !isCalendarElem(e.relatedTarget as HTMLElement);
+        !isInput &&
+        !isCalendarElement &&
+        !isCalendarElem(e.relatedTarget as HTMLElement);
 
       const isIgnored = !self.config.ignoredFocusElements.some((elem) =>
         elem.contains(eventTarget as Node)
@@ -1486,7 +1477,7 @@ function FlatpickrInstance(
         if (self.config.allowInput) {
           self.setDate(
             self._input.value,
-            true,
+            false,
             self.config.altInput
               ? self.config.altFormat
               : self.config.dateFormat
@@ -1502,7 +1493,7 @@ function FlatpickrInstance(
         ) {
           updateTime();
         }
-        
+
         self.close();
 
         if (