Skip to content

onCalendarClose is not called when selecting the same day as start&end date in selectsRange mode #4076

@guanpu

Description

@guanpu

Describe the bug
A clear and concise description of what the bug is.
As per title, the calendar is not closed, nor is onCalendarClose being called if the startDate and endDate is the same day.

To Reproduce
try it this way:

function DateRangePicker() {
  const [startDate, setStartDate] = React.useState(Date.now());
  const [endDate, setEndDate] = React.useState(Date.now());
  const onChange = (dates) => {
    const [start, end] = dates;
    setStartDate(start);
    setEndDate(end);
  };
  const handleCalendarClose = () => console.log("Calendar closed");

  return (
    <DatePicker
      selected={startDate}
      onChange={onChange}
      startDate={startDate}
      endDate={endDate}
      shouldCloseOnSelect={true}
      onCalendarClose={handleCalendarClose}
      selectsRange
    />
  );
}
  1. Open Calendar
  2. select some date as startDate
  3. select the same date as endDate
  4. the calendar is not automatically closed, nor does the "Calendar closed" log showing up in the console.

Expected behavior
Expect calendar closed and onCalendarClose being called, just as if the startDate and endDate is not the same day.

Desktop (please complete the following information):

  • OS: ubuntu 22.04
  • Browser firefox
  • Version 111

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions