Skip to content

fix: Start can not after end #95

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jun 29, 2020
Merged

fix: Start can not after end #95

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
9078055
fix: Start can not after end
zombieJ Jun 29, 2020
af28b6e
more test case
zombieJ Jun 29, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 11 additions & 5 deletions src/RangePicker.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -387,7 +387,7 @@ function InnerRangePicker<DateType>(props: RangePickerProps<DateType>) {

function triggerChange(newValue: RangeValue<DateType>, sourceIndex: 0 | 1) {
let values = newValue;
const startValue = getValue(values, 0);
let startValue = getValue(values, 0);
let endValue = getValue(values, 1);

// >>>>> Format start & end values
Expand All @@ -404,11 +404,18 @@ function InnerRangePicker<DateType>(props: RangePickerProps<DateType>) {
!isSameDate(generateConfig, startValue, endValue))
) {
// Clean up end date when start date is after end date
values = [startValue, null];
endValue = null;
if (sourceIndex === 0) {
values = [startValue, null];
endValue = null;
} else {
startValue = null;
values = [null, endValue];
}

// Clean up cache since invalidate
openRecordsRef.current = {};
openRecordsRef.current = {
[sourceIndex]: true,
};
} else if (picker !== 'time' || order !== false) {
// Reorder when in same date
values = reorderValues(values, generateConfig);
Expand Down Expand Up @@ -954,7 +961,6 @@ function InnerRangePicker<DateType>(props: RangePickerProps<DateType>) {

if (type === 'submit' || (type !== 'key' && !needConfirmButton)) {
// triggerChange will also update selected values
// triggerChangeOld(values);
triggerChange(values, mergedActivePickerIndex);
} else {
setSelectedValue(values);
Expand Down
78 changes: 56 additions & 22 deletions tests/range.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1247,19 +1247,36 @@ describe('Picker.Range', () => {
expect(wrapper.isOpen()).toBeFalsy();
});

it('valued: start -> end -> close', () => {
const wrapper = mount(
<MomentRangePicker defaultValue={[getMoment('1989-01-01'), getMoment('1990-01-01')]} />,
);
describe('valued: start -> end -> close', () => {
it('in range', () => {
const wrapper = mount(
<MomentRangePicker defaultValue={[getMoment('1989-01-01'), getMoment('1990-01-01')]} />,
);

wrapper.openPicker(0);
wrapper.inputValue('1990-11-28');
wrapper.closePicker(0);
expect(wrapper.isOpen()).toBeTruthy();
wrapper.openPicker(0);
wrapper.inputValue('1990-11-28');
wrapper.closePicker(0);
expect(wrapper.isOpen()).toBeTruthy();

wrapper.inputValue('1990-12-23');
wrapper.closePicker(1);
expect(wrapper.isOpen()).toBeFalsy();
wrapper.inputValue('1990-12-23');
wrapper.closePicker(1);
expect(wrapper.isOpen()).toBeFalsy();
});

it('new start is after end', () => {
const wrapper = mount(
<MomentRangePicker defaultValue={[getMoment('1989-01-10'), getMoment('1989-01-15')]} />,
);

wrapper.openPicker(0);
wrapper.inputValue('1989-01-20');
wrapper.closePicker(0);
expect(wrapper.isOpen()).toBeTruthy();

wrapper.inputValue('1989-01-25');
wrapper.closePicker(1);
expect(wrapper.isOpen()).toBeFalsy();
});
});

it('empty: end -> start -> close', () => {
Expand All @@ -1275,19 +1292,36 @@ describe('Picker.Range', () => {
expect(wrapper.isOpen()).toBeFalsy();
});

it('valued: end -> start -> close', () => {
const wrapper = mount(
<MomentRangePicker defaultValue={[getMoment('1989-01-01'), getMoment('1990-01-01')]} />,
);
describe('valued: end -> start -> close', () => {
it('in range', () => {
const wrapper = mount(
<MomentRangePicker defaultValue={[getMoment('1989-01-01'), getMoment('1990-01-01')]} />,
);

wrapper.openPicker(1);
wrapper.inputValue('1990-11-28', 1);
wrapper.closePicker(1);
expect(wrapper.isOpen()).toBeTruthy();
wrapper.openPicker(1);
wrapper.inputValue('1990-11-28', 1);
wrapper.closePicker(1);
expect(wrapper.isOpen()).toBeTruthy();

wrapper.inputValue('1989-01-01');
wrapper.closePicker(0);
expect(wrapper.isOpen()).toBeFalsy();
wrapper.inputValue('1989-01-01');
wrapper.closePicker(0);
expect(wrapper.isOpen()).toBeFalsy();
});

it('new end is before start', () => {
const wrapper = mount(
<MomentRangePicker defaultValue={[getMoment('1989-01-10'), getMoment('1989-01-15')]} />,
);

wrapper.openPicker(1);
wrapper.inputValue('1989-01-07', 1);
wrapper.closePicker(1);
expect(wrapper.isOpen()).toBeTruthy();

wrapper.inputValue('1989-01-01');
wrapper.closePicker(0);
expect(wrapper.isOpen()).toBeFalsy();
});
});

it('not change: start not to end', () => {
Expand Down