Skip to content

Commit 4724a58

Browse files
authored
fix: the RangePicker sets disabledDate, the date cannot be modified (#888)
* fix: After the RangePicker sets disabledDate, the date cannot be modified. * Add test case
1 parent 281bf37 commit 4724a58

File tree

2 files changed

+41
-10
lines changed

2 files changed

+41
-10
lines changed

src/PickerInput/hooks/useRangeValue.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -270,10 +270,9 @@ export default function useRangeValue<ValueType extends DateType[], DateType ext
270270
// >>> Invalid
271271
const validateDates =
272272
// Validate start
273-
(!start || !isInvalidateDate(start, { activeIndex: 0 })) &&
273+
(disabled[0] || !start || !isInvalidateDate(start, { activeIndex: 0 })) &&
274274
// Validate end
275-
(!end || !isInvalidateDate(end, { from: start, activeIndex: 1 }));
276-
275+
(disabled[1] || !end || !isInvalidateDate(end, { from: start, activeIndex: 1 }));
277276
// >>> Result
278277
const allPassed =
279278
// Null value is from clear button

tests/range.spec.tsx

+39-7
Original file line numberDiff line numberDiff line change
@@ -231,6 +231,43 @@ describe('Picker.Range', () => {
231231
expect(baseElement.querySelector('.rc-picker-dropdown-hidden')).toBeTruthy();
232232
});
233233

234+
it('should not be checked if the startDate is disabled', () => {
235+
const onChange = jest.fn();
236+
const { container } = render(
237+
<DayRangePicker
238+
disabled={[true, false]}
239+
defaultValue={[getDay('2024-10-28'), getDay('2024-11-20')]}
240+
disabledDate={(date: Dayjs) => date <= dayjs('2024-11-20').endOf('day')}
241+
onChange={onChange}
242+
/>,
243+
);
244+
245+
openPicker(container, 1);
246+
selectCell('21', 1);
247+
expect(onChange).toHaveBeenCalledWith(
248+
[expect.anything(), expect.anything()],
249+
['2024-10-28', '2024-11-21'],
250+
);
251+
});
252+
it('should not be checked if the endDate is disabled', () => {
253+
const onChange = jest.fn();
254+
const { container } = render(
255+
<DayRangePicker
256+
disabled={[false, true]}
257+
defaultValue={[getDay('2024-10-28'), getDay('2024-11-20')]}
258+
disabledDate={(date: Dayjs) => date >= dayjs('2024-11-10').endOf('day')}
259+
onChange={onChange}
260+
/>,
261+
);
262+
263+
openPicker(container, 0);
264+
selectCell('21', 0);
265+
expect(onChange).toHaveBeenCalledWith(
266+
[expect.anything(), expect.anything()],
267+
['2024-10-21', '2024-11-20'],
268+
);
269+
});
270+
234271
it('should close panel when finish first choose with showTime = true and disabled = [false, true]', () => {
235272
const { baseElement } = render(<DayRangePicker showTime disabled={[false, true]} />);
236273
expect(baseElement.querySelectorAll('.rc-picker-input')).toHaveLength(2);
@@ -541,7 +578,7 @@ describe('Picker.Range', () => {
541578
it('pass tabIndex', () => {
542579
const { container } = render(
543580
<div>
544-
<DayRangePicker tabIndex={-1}/>
581+
<DayRangePicker tabIndex={-1} />
545582
</div>,
546583
);
547584

@@ -705,12 +742,7 @@ describe('Picker.Range', () => {
705742
});
706743

707744
it('prefix', () => {
708-
render(
709-
<DayRangePicker
710-
prefix={<span className="prefix" />}
711-
allowClear
712-
/>,
713-
);
745+
render(<DayRangePicker prefix={<span className="prefix" />} allowClear />);
714746
expect(document.querySelector('.prefix')).toBeInTheDocument();
715747
});
716748

0 commit comments

Comments
 (0)