Skip to content

Commit df0a41f

Browse files
committed
Fix and test turning goToRangeStartOnSelect off
1 parent f56c7ae commit df0a41f

File tree

2 files changed

+81
-2
lines changed

2 files changed

+81
-2
lines changed

src/Calendar.spec.tsx

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -707,6 +707,85 @@ describe('Calendar', () => {
707707

708708
expect(onActiveStartDateChange).not.toHaveBeenCalled();
709709
});
710+
711+
it('returns to start of range when range is completed', () => {
712+
const onActiveStartDateChange = vi.fn();
713+
714+
const initialRange = new Date(2017, 0, 10);
715+
716+
const { container } = render(
717+
<Calendar
718+
view="month"
719+
selectRange
720+
onActiveStartDateChange={onActiveStartDateChange}
721+
defaultValue={initialRange}
722+
/>,
723+
);
724+
725+
const nextMonthButton = container.querySelector(
726+
'button.react-calendar__navigation__next-button',
727+
) as HTMLButtonElement;
728+
729+
act(() => {
730+
nextMonthButton.click();
731+
});
732+
// Disregard the call on the above button click
733+
onActiveStartDateChange.mockClear();
734+
735+
// First day not in the previous month
736+
const firstDayTile = container.querySelector(
737+
'.react-calendar__tile:not([react-calendar__month-view__days__day--weekend])',
738+
) as HTMLButtonElement;
739+
740+
act(() => {
741+
firstDayTile.click();
742+
});
743+
744+
expect(onActiveStartDateChange).toHaveBeenCalledWith(
745+
expect.objectContaining({
746+
action: 'onChange',
747+
activeStartDate: new Date(2017, 0, 1),
748+
view: 'month',
749+
}),
750+
);
751+
});
752+
753+
it('does not change activeStartDate on range completion when goToRangeStartOnSelect is set to false', () => {
754+
const onActiveStartDateChange = vi.fn();
755+
756+
const initialRange = new Date(2017, 0, 10);
757+
758+
const { container } = render(
759+
<Calendar
760+
view="month"
761+
selectRange
762+
onActiveStartDateChange={onActiveStartDateChange}
763+
defaultValue={initialRange}
764+
goToRangeStartOnSelect={false}
765+
/>,
766+
);
767+
768+
const nextMonthButton = container.querySelector(
769+
'button.react-calendar__navigation__next-button',
770+
) as HTMLButtonElement;
771+
772+
act(() => {
773+
nextMonthButton.click();
774+
});
775+
// Disregard the call on the above button click
776+
onActiveStartDateChange.mockClear();
777+
778+
// First day not in the previous month
779+
const firstDayTile = container.querySelector(
780+
'.react-calendar__tile:not([react-calendar__month-view__days__day--weekend])',
781+
) as HTMLButtonElement;
782+
783+
act(() => {
784+
firstDayTile.click();
785+
});
786+
787+
expect(onActiveStartDateChange).not.toHaveBeenCalled();
788+
});
710789
});
711790

712791
describe('handles view change properly', () => {

src/Calendar.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -496,7 +496,7 @@ export default class Calendar extends Component<CalendarProps, CalendarState> {
496496
this.setState(nextState, () => {
497497
const args = {
498498
action: nextState.action,
499-
activeStartDate: nextState.activeStartDate || this.activeStartDate,
499+
activeStartDate: nextState.activeStartDate || prevArgs.activeStartDate,
500500
value: ('value' in nextState && nextState.value) || this.value,
501501
view: ('view' in nextState && nextState.view) || this.view,
502502
};
@@ -691,7 +691,7 @@ export default class Calendar extends Component<CalendarProps, CalendarState> {
691691
...(this.props as CalendarPropsWithDefaults),
692692
value: nextValue,
693693
})
694-
: null;
694+
: this.activeStartDate;
695695

696696
event.persist();
697697

0 commit comments

Comments
 (0)