Add coverage tests for calendar interactions

Author: martijnrusschen

src/test/click_outside_wrapper.test.tsx

@@ -194,4 +194,35 @@ describe("ClickOutsideWrapper", () => {
 
     removeEventListenerSpy.mockRestore();
   });
+
+  it("invokes handler registered on document with composedPath target", () => {
+    const addEventListenerSpy = jest.spyOn(document, "addEventListener");
+    const removeEventListenerSpy = jest.spyOn(document, "removeEventListener");
+
+    const { unmount } = render(
+      <ClickOutsideWrapper onClickOutside={onClickOutsideMock}>
+        <div>Inside</div>
+      </ClickOutsideWrapper>,
+    );
+
+    const handlerEntry = addEventListenerSpy.mock.calls.find(
+      ([type]) => type === "mousedown",
+    );
+    const handler = handlerEntry?.[1] as EventListener;
+
+    const outsideNode = document.createElement("div");
+    const mockEvent = {
+      composed: true,
+      composedPath: () => [outsideNode],
+      target: outsideNode,
+    } as unknown as MouseEvent;
+
+    handler(mockEvent);
+
+    expect(onClickOutsideMock).toHaveBeenCalledTimes(1);
+
+    unmount();
+    addEventListenerSpy.mockRestore();
+    removeEventListenerSpy.mockRestore();
+  });
 });

src/test/date_utils_test.test.ts

@@ -1105,6 +1105,14 @@ describe("date_utils", () => {
 
       expect(isMonthInRange(startDate, endDate, 5, day)).toBe(true);
     });
+
+    it("should return false when the start date is after the end date", () => {
+      const day = newDate("2024-01-01");
+      const startDate = newDate("2024-02-01");
+      const endDate = newDate("2024-01-01");
+
+      expect(isMonthInRange(startDate, endDate, 1, day)).toBe(false);
+    });
   });
 
   describe("getStartOfYear", () => {
@@ -1139,6 +1147,50 @@ describe("date_utils", () => {
 
       expect(isQuarterInRange(startDate, endDate, 5, day)).toBe(true);
     });
+
+    it("should return false when the start quarter is after the end quarter", () => {
+      const day = newDate("2024-01-01");
+      const startDate = newDate("2024-10-01");
+      const endDate = newDate("2024-04-01");
+
+      expect(isQuarterInRange(startDate, endDate, 1, day)).toBe(false);
+    });
+  });
+
+  describe("isTimeInDisabledRange", () => {
+    it("throws when either minTime or maxTime is missing", () => {
+      expect(() =>
+        isTimeInDisabledRange(newDate(), { minTime: newDate() }),
+      ).toThrow("Both minTime and maxTime props required");
+    });
+
+    it("returns false when isWithinInterval throws", () => {
+      jest.isolateModules(() => {
+        jest.doMock("date-fns", () => {
+          const actual = jest.requireActual("date-fns");
+          return {
+            ...actual,
+            isWithinInterval: () => {
+              throw new Error("boom");
+            },
+          };
+        });
+
+        // eslint-disable-next-line @typescript-eslint/no-var-requires -- isolated mock import
+        const {
+          isTimeInDisabledRange: mockedIsTimeInDisabledRange,
+        } = require("../date_utils");
+        expect(
+          mockedIsTimeInDisabledRange(new Date(), {
+            minTime: new Date(),
+            maxTime: new Date(),
+          }),
+        ).toBe(false);
+
+        jest.resetModules();
+        jest.dontMock("date-fns");
+      });
+    });
   });
 
   describe("isYearInRange", () => {
@@ -1581,13 +1633,30 @@ describe("date_utils", () => {
 
   describe("isDayInRange error handling", () => {
     it("returns false when isWithinInterval throws", () => {
-      const testDate = new Date("2024-01-15");
-      const invalidStartDate = new Date("invalid");
-      const invalidEndDate = new Date("also-invalid");
-
-      const result = isDayInRange(testDate, invalidStartDate, invalidEndDate);
-
-      expect(result).toBe(false);
+      jest.isolateModules(() => {
+        jest.doMock("date-fns", () => {
+          const actual = jest.requireActual("date-fns");
+          return {
+            ...actual,
+            isWithinInterval: () => {
+              throw new Error("boom");
+            },
+          };
+        });
+
+        // eslint-disable-next-line @typescript-eslint/no-var-requires -- isolated mock import
+        const { isDayInRange: mockedIsDayInRange } = require("../date_utils");
+        expect(
+          mockedIsDayInRange(
+            new Date("2024-01-15"),
+            new Date("2024-01-10"),
+            new Date("2024-01-20"),
+          ),
+        ).toBe(false);
+
+        jest.resetModules();
+        jest.dontMock("date-fns");
+      });
     });
 
     it("returns true for dates inside a valid range", () => {

src/test/datepicker_test.test.tsx

@@ -36,6 +36,22 @@ import {
   setupMockResizeObserver,
 } from "./test_utils";
 
+const renderDatePickerWithRef = (
+  props: React.ComponentProps<typeof DatePicker>,
+) => {
+  let instance: DatePicker | null = null;
+  const result = render(
+    <DatePicker
+      ref={(node) => {
+        instance = node;
+      }}
+      {...props}
+    />,
+  );
+
+  return { ...result, instance: instance as DatePicker | null };
+};
+
 function getSelectedDayNode(container: HTMLElement) {
   return (
     container.querySelector('.react-datepicker__day[tabindex="0"]') ?? undefined
@@ -5014,6 +5030,195 @@ describe("DatePicker", () => {
       jest.useRealTimers();
     });
 
+    it("deferFocusInput cancels pending timeouts before focusing input", () => {
+      jest.useFakeTimers();
+      const { instance } = renderDatePickerWithRef({
+        selected: newDate(),
+        onChange: () => {},
+      });
+
+      expect(instance).not.toBeNull();
+
+      const setFocusSpy = jest
+        .spyOn(instance as DatePicker, "setFocus")
+        .mockImplementation(() => undefined);
+
+      act(() => {
+        instance?.deferFocusInput();
+        instance?.deferFocusInput();
+      });
+
+      jest.advanceTimersByTime(1);
+
+      expect(setFocusSpy).toHaveBeenCalledTimes(2);
+
+      setFocusSpy.mockRestore();
+      jest.useRealTimers();
+    });
+
+    it("clears ranges when changed date is null and start date exists", () => {
+      const onChange = jest.fn();
+      const startDate = new Date("2024-01-15T00:00:00");
+      const { instance } = renderDatePickerWithRef({
+        inline: true,
+        selectsRange: true,
+        startDate,
+        endDate: null,
+        selected: null,
+        onChange,
+      });
+
+      act(() => {
+        instance?.setSelected(null);
+      });
+
+      expect(onChange).toHaveBeenCalledWith([null, null], undefined);
+    });
+
+    it("reports input errors when escaping with invalid preSelection", () => {
+      const onInputError = jest.fn();
+      const { container, instance } = renderDatePickerWithRef({
+        selected: null,
+        onChange: () => {},
+        onInputError,
+      });
+
+      act(() => {
+        instance?.setState({ preSelection: "invalid-date" as unknown as Date });
+      });
+
+      const input = safeQuerySelector<HTMLInputElement>(container, "input");
+      fireEvent.keyDown(input, { key: "Escape" });
+
+      expect(onInputError).toHaveBeenCalled();
+    });
+
+    it("reports input errors when input key down completes with invalid preSelection", () => {
+      const onInputError = jest.fn();
+      const { container, instance } = renderDatePickerWithRef({
+        selected: null,
+        onChange: () => {},
+        onInputError,
+      });
+
+      act(() => {
+        instance?.setState({ preSelection: "invalid-date" as unknown as Date });
+      });
+
+      const input = safeQuerySelector<HTMLInputElement>(container, "input");
+      act(() => {
+        fireEvent.keyDown(input, { key: "Tab" });
+      });
+
+      expect(onInputError).toHaveBeenCalled();
+    });
+
+    it("reports input errors when unsupported key is pressed in calendar grid", () => {
+      const onInputError = jest.fn();
+      const { instance } = renderDatePickerWithRef({
+        selected: newDate(),
+        onChange: () => {},
+        onInputError,
+        inline: true,
+      });
+
+      act(() => {
+        instance?.setState({ preSelection: newDate() });
+      });
+
+      act(() => {
+        instance?.onDayKeyDown({
+          key: "A",
+          shiftKey: false,
+          preventDefault: jest.fn(),
+          target: document.createElement("div"),
+        } as unknown as React.KeyboardEvent<HTMLDivElement>);
+      });
+
+      expect(onInputError).toHaveBeenCalled();
+    });
+
+    it("reports input errors when escape is pressed within the calendar grid", () => {
+      const onInputError = jest.fn();
+      const { instance } = renderDatePickerWithRef({
+        selected: null,
+        onChange: () => {},
+        onInputError,
+        inline: true,
+      });
+
+      act(() => {
+        instance?.setState({ preSelection: "invalid-date" as unknown as Date });
+      });
+
+      act(() => {
+        instance?.onDayKeyDown({
+          key: "Escape",
+          shiftKey: false,
+          preventDefault: jest.fn(),
+          target: document.createElement("div"),
+        } as unknown as React.KeyboardEvent<HTMLDivElement>);
+      });
+
+      expect(onInputError).toHaveBeenCalled();
+    });
+
+    describe("aria-live messaging", () => {
+      it("describes range selections", () => {
+        const startDate = new Date("2024-01-01T00:00:00");
+        const endDate = new Date("2024-01-02T00:00:00");
+        const { instance } = renderDatePickerWithRef({
+          selectsRange: true,
+          startDate,
+          endDate,
+          selected: endDate,
+        });
+
+        const message = instance?.renderAriaLiveRegion();
+        expect(message?.props.children).toContain("Selected start date");
+      });
+
+      it("describes time-only selections", () => {
+        const { instance } = renderDatePickerWithRef({
+          showTimeSelectOnly: true,
+          selected: new Date("2024-01-01T12:00:00"),
+        });
+
+        const message = instance?.renderAriaLiveRegion();
+        expect(message?.props.children).toContain("Selected time:");
+      });
+
+      it("describes year picker selections", () => {
+        const { instance } = renderDatePickerWithRef({
+          showYearPicker: true,
+          selected: new Date("2024-01-01T00:00:00"),
+        });
+
+        const message = instance?.renderAriaLiveRegion();
+        expect(message?.props.children).toContain("Selected year:");
+      });
+
+      it("describes month-year picker selections", () => {
+        const { instance } = renderDatePickerWithRef({
+          showMonthYearPicker: true,
+          selected: new Date("2024-03-01T00:00:00"),
+        });
+
+        const message = instance?.renderAriaLiveRegion();
+        expect(message?.props.children).toContain("Selected month:");
+      });
+
+      it("describes quarter picker selections", () => {
+        const { instance } = renderDatePickerWithRef({
+          showQuarterYearPicker: true,
+          selected: new Date("2024-06-01T00:00:00"),
+        });
+
+        const message = instance?.renderAriaLiveRegion();
+        expect(message?.props.children).toContain("Selected quarter:");
+      });
+    });
+
     it("should handle focus on year dropdown", () => {
       const { container } = render(
         <DatePicker