diff --git a/src/PickerInput/SinglePicker.tsx b/src/PickerInput/SinglePicker.tsx index 9fe862d84..552c29e7d 100644 --- a/src/PickerInput/SinglePicker.tsx +++ b/src/PickerInput/SinglePicker.tsx @@ -441,6 +441,11 @@ function Picker( const onPanelSelect = (date: DateType) => { lastOperation('panel'); + // Not change values if multiple and current panel is to match with picker + if (multiple && internalMode !== picker) { + return; + } + const nextValues = multiple ? toggleDates(getCalendarValue(), date) : [date]; // Only trigger calendar event but not update internal `calendarValue` state diff --git a/tests/multiple.spec.tsx b/tests/multiple.spec.tsx index fa96e4676..f12facf80 100644 --- a/tests/multiple.spec.tsx +++ b/tests/multiple.spec.tsx @@ -155,4 +155,40 @@ describe('Picker.Multiple', () => { ).toBeFalsy(); }); }); + + it('click year panel should not select', () => { + const onChange = jest.fn(); + const onCalendarChange = jest.fn(); + const { container } = render( + , + ); + + expect(container.querySelector('.rc-picker-multiple')).toBeTruthy(); + + openPicker(container); + + // Select year + fireEvent.click(document.querySelector('.rc-picker-year-btn')); + selectCell(1998); + expect(onChange).not.toHaveBeenCalled(); + expect(onCalendarChange).not.toHaveBeenCalled(); + + // Select Month + selectCell('Oct'); + expect(onChange).not.toHaveBeenCalled(); + expect(onCalendarChange).not.toHaveBeenCalled(); + + // Select Date + selectCell(23); + expect(onChange).not.toHaveBeenCalled(); + expect(onCalendarChange).toHaveBeenCalledWith( + expect.anything(), + ['1998-10-23'], + expect.anything(), + ); + + // Confirm + fireEvent.click(document.querySelector('.rc-picker-ok button')); + expect(onChange).toHaveBeenCalledWith(expect.anything(), ['1998-10-23']); + }); });