diff --git a/tests/unit/calendar/__snapshots__/calendar.normal.spec.js.snap b/tests/unit/calendar/__snapshots__/calendar.normal.spec.js.snap new file mode 100644 index 00000000..1acce6b7 --- /dev/null +++ b/tests/unit/calendar/__snapshots__/calendar.normal.spec.js.snap @@ -0,0 +1,6727 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Calendar (normal mode) #render() should merge the locale definition with the default one 1`] = ` + +
+ +
+ +
+ +
+
+ Seg +
+
+ Ter +
+
+ Qua +
+
+ Qui +
+
+ Sex +
+
+ Sáb +
+
+ Dom +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should merge the locale definition with the default one 2`] = ` + +
+ +
+ +
+ +
+
+ Sun +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should only be able to select a date that fits the isDaySelectableFn condition, when set 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should only change the renderDate and do nothing else if nav callbacks are not defined 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should only change the selectedDate and do nothing else if selection callbacks are not defined 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should render the calendar with selectionType as normal, initialized in the current date 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should reset selectedDates, when at least one of the initialDates are outside min/max limit 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should set maxLimit, with a given "maxDate" attribute 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should set minLimit, with a given "minDate" attribute 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should set renderDate and not minLimit, with a given "initalDates" attribute 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should set renderDate to next/previous months when the next/previous btns are pressed 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should set renderDate to the month of the date pressed when different from current one 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (normal mode) #render() should set selectedDate to the date of the button pressed 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; diff --git a/tests/unit/calendar/__snapshots__/calendar.range.spec.js.snap b/tests/unit/calendar/__snapshots__/calendar.range.spec.js.snap new file mode 100644 index 00000000..4c61800c --- /dev/null +++ b/tests/unit/calendar/__snapshots__/calendar.range.spec.js.snap @@ -0,0 +1,1518 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Calendar (range mode) #render() should render the calendar with selectionType as range, initialized in the current date 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (range mode) #render() should set the minLimit and dates properly and reset them at 3rd click 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; + +exports[`Calendar (range mode) #render() should set the minLimit to the same date as the first initialDates when provided 1`] = ` + +
+ +
+ +
+ +
+
+ Mon +
+
+ Tue +
+
+ Wed +
+
+ Thu +
+
+ Fri +
+
+ Sat +
+
+ Sun +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ +`; diff --git a/tests/unit/calendar/calendar.normal.spec.js b/tests/unit/calendar/calendar.normal.spec.js new file mode 100644 index 00000000..3a01ac50 --- /dev/null +++ b/tests/unit/calendar/calendar.normal.spec.js @@ -0,0 +1,390 @@ +import { mount } from 'enzyme'; +import React from 'react'; +import Calendar from '../../../components/calendar/calendar'; + +describe('Calendar (normal mode)', () => { + describe('#render()', () => { + it('should render the calendar with selectionType as normal, initialized in the current date', () => { + const todayDate = new Date(); + todayDate.setHours(0); + todayDate.setMinutes(0); + todayDate.setSeconds(0); + todayDate.setMilliseconds(0); + + const wrapper = mount( + + ); + + expect(wrapper).toMatchSnapshot(); + expect(wrapper.props()).toEqual({ + dataAttrs: {}, + mods: [], + selectionType: 'normal', + }); + expect(wrapper.state()).toEqual({ + maxLimit: null, + minLimit: null, + renderDate: todayDate, + selectedDates: [null, null], + }); + }); + + it('should set renderDate and not minLimit, with a given "initalDates" attribute', () => { + const initialDate = '2017-03-20'; + const initialDateObject = new Date(initialDate); + initialDateObject.setHours(0); + initialDateObject.setMinutes(0); + initialDateObject.setSeconds(0); + initialDateObject.setMilliseconds(0); + + const wrapper = mount( + + ); + + expect(wrapper).toMatchSnapshot(); + expect(wrapper.props()).toEqual({ + dataAttrs: {}, + initialDates: [initialDate], + mods: [], + selectionType: 'normal', + }); + expect(wrapper.state()).toEqual({ + maxLimit: null, + minLimit: null, + renderDate: initialDateObject, + selectedDates: [initialDateObject, null], + }); + }); + + it('should set maxLimit, with a given "maxDate" attribute', () => { + const maxDate = '2017-03-20'; + const todayDate = new Date(); + const maxDateObject = new Date(maxDate); + + todayDate.setHours(0); + todayDate.setMinutes(0); + todayDate.setSeconds(0); + todayDate.setMilliseconds(0); + + maxDateObject.setHours(23); + maxDateObject.setMinutes(59); + maxDateObject.setSeconds(59); + maxDateObject.setMilliseconds(999); + + const wrapper = mount( + + ); + + expect(wrapper).toMatchSnapshot(); + expect(wrapper.props()).toEqual({ + dataAttrs: {}, + maxDate, + mods: [], + selectionType: 'normal', + }); + expect(wrapper.state()).toEqual({ + maxLimit: maxDateObject, + minLimit: null, + renderDate: todayDate, + selectedDates: [null, null], + }); + }); + + it('should set minLimit, with a given "minDate" attribute', () => { + const minDate = '2017-03-20'; + const todayDate = new Date(); + const minDateObject = new Date(minDate); + + todayDate.setHours(0); + todayDate.setMinutes(0); + todayDate.setSeconds(0); + todayDate.setMilliseconds(0); + + minDateObject.setHours(0); + minDateObject.setMinutes(0); + minDateObject.setSeconds(0); + minDateObject.setMilliseconds(0); + + const wrapper = mount( + + ); + + expect(wrapper).toMatchSnapshot(); + expect(wrapper.props()).toEqual({ + dataAttrs: {}, + minDate, + mods: [], + selectionType: 'normal', + }); + expect(wrapper.state()).toEqual({ + maxLimit: null, + minLimit: minDateObject, + renderDate: todayDate, + selectedDates: [null, null], + }); + }); + + it('should reset selectedDates, when at least one of the initialDates are outside min/max limit', () => { + const initialDates = ['2017-03-23', '2017-03-29']; + const minDate = '2017-03-20'; + const maxDate = '2017-03-25'; + const maxDateObject = new Date(maxDate); + const minDateObject = new Date(minDate); + + const initialDatesObjects = initialDates.map((dateStr) => { + const dt = new Date(dateStr); + dt.setHours(0); + dt.setMinutes(0); + dt.setSeconds(0); + dt.setMilliseconds(0); + return dt; + }); + + maxDateObject.setHours(23); + maxDateObject.setMinutes(59); + maxDateObject.setSeconds(59); + maxDateObject.setMilliseconds(999); + + minDateObject.setHours(0); + minDateObject.setMinutes(0); + minDateObject.setSeconds(0); + minDateObject.setMilliseconds(0); + + + const wrapper = mount( + + ); + + expect(wrapper).toMatchSnapshot(); + expect(wrapper.props()).toEqual({ + dataAttrs: {}, + initialDates, + maxDate, + minDate, + mods: [], + selectionType: 'normal', + }); + expect(wrapper.state()).toEqual({ + maxLimit: maxDateObject, + minLimit: minDateObject, + renderDate: initialDatesObjects[0], + selectedDates: [null, null], + }); + }); + + it('should set renderDate to next/previous months when the next/previous btns are pressed', () => { + const initialDate = '2017-03-05'; + const initialDateObject = new Date(initialDate); + initialDateObject.setHours(0); + initialDateObject.setMinutes(0); + initialDateObject.setSeconds(0); + initialDateObject.setMilliseconds(0); + + const nextMock = jest.fn(); + const previousMock = jest.fn(); + + const wrapper = mount( + + ); + expect(wrapper).toMatchSnapshot(); + + /** Clicks to go next month */ + wrapper.find('.ui-calendar-days__next-month').simulate('click'); + + const nextMonthDateObj = new Date(initialDate); + nextMonthDateObj.setMonth(nextMonthDateObj.getMonth() + 1); + nextMonthDateObj.setHours(0); + nextMonthDateObj.setMinutes(0); + nextMonthDateObj.setSeconds(0); + nextMonthDateObj.setMilliseconds(0); + + expect(wrapper.state().renderDate).toEqual(nextMonthDateObj); + expect(nextMock.mock.calls.length).toEqual(1); + expect(nextMock.mock.calls[0][0]).toEqual(wrapper.state().renderDate); + + /** Clicks to go next month */ + wrapper.find('.ui-calendar-days__previous-month').simulate('click'); + + expect(wrapper.state().renderDate).toEqual(initialDateObject); + expect(previousMock.mock.calls.length).toEqual(1); + expect(previousMock.mock.calls[0][0]).toEqual(wrapper.state().renderDate); + }); + + it('should set selectedDate to the date of the button pressed', () => { + const initialDate = '2017-03-05'; + const initialDateObject = new Date(initialDate); + initialDateObject.setHours(0); + initialDateObject.setMinutes(0); + initialDateObject.setSeconds(0); + initialDateObject.setMilliseconds(0); + + const wrapper = mount( + + ); + expect(wrapper).toMatchSnapshot(); + + /** Clicks to go select the day */ + wrapper.find(`[data-date="2017-03-25"]`).simulate('click'); + + expect(wrapper.state().selectedDates[0].getDate()).toEqual(25); + }); + + it('should set renderDate to the month of the date pressed when different from current one', () => { + const initialDate = '2017-03-05'; + const initialDateObject = new Date(initialDate); + initialDateObject.setHours(0); + initialDateObject.setMinutes(0); + initialDateObject.setSeconds(0); + initialDateObject.setMilliseconds(0); + + const selectDayMock = jest.fn(); + + const wrapper = mount( + + ); + expect(wrapper).toMatchSnapshot(); + + /** Clicks to go select the day */ + expect(wrapper.state().renderDate.getMonth()).toEqual(2); + + wrapper.find(`[data-date="2017-04-01"]`).simulate('click'); + + expect(wrapper.state().selectedDates[0].getMonth()).toEqual(3); + expect(wrapper.state().renderDate.getMonth()).toEqual(3); + expect(selectDayMock.mock.calls.length).toEqual(1); + expect(selectDayMock.mock.calls[0][0]).toEqual(wrapper.state().selectedDates); + }); + + it('should only change the renderDate and do nothing else if nav callbacks are not defined', () => { + const initialDate = '2017-03-05'; + const initialDateObject = new Date(initialDate); + initialDateObject.setHours(0); + initialDateObject.setMinutes(0); + initialDateObject.setSeconds(0); + initialDateObject.setMilliseconds(0); + + const wrapper = mount( + + ); + expect(wrapper).toMatchSnapshot(); + + /** Clicks to go next month */ + wrapper.find('.ui-calendar-days__next-month').simulate('click'); + + const nextMonthDateObj = new Date(initialDate); + nextMonthDateObj.setMonth(nextMonthDateObj.getMonth() + 1); + nextMonthDateObj.setHours(0); + nextMonthDateObj.setMinutes(0); + nextMonthDateObj.setSeconds(0); + nextMonthDateObj.setMilliseconds(0); + + expect(wrapper.state().renderDate).toEqual(nextMonthDateObj); + + /** Clicks to go next month */ + wrapper.find('.ui-calendar-days__previous-month').simulate('click'); + + expect(wrapper.state().renderDate).toEqual(initialDateObject); + }); + + it('should only change the selectedDate and do nothing else if selection callbacks are not defined', () => { + const initialDate = '2017-03-05'; + const selectedDate = '2017-03-20'; + const initialDateObject = new Date(initialDate); + initialDateObject.setHours(0); + initialDateObject.setMinutes(0); + initialDateObject.setSeconds(0); + initialDateObject.setMilliseconds(0); + + const wrapper = mount( + + ); + expect(wrapper).toMatchSnapshot(); + + /** Clicks to go next month */ + wrapper.find(`[data-date="${selectedDate}"]`).simulate('click'); + + const expectedSelectedDate = new Date(selectedDate); + expectedSelectedDate.setHours(0); + expectedSelectedDate.setMinutes(0); + expectedSelectedDate.setSeconds(0); + expectedSelectedDate.setMilliseconds(0); + + expect(wrapper.state().selectedDates).toEqual([expectedSelectedDate, null]); + }); + + it('should only be able to select a date that fits the isDaySelectableFn condition, when set', () => { + const initialDate = '2017-03-05'; + const nonSelectableDate = '2017-03-20'; + const selectableDate = '2017-03-21'; + + const isDaySelectableFn = dt => dt.getDate() === 21; + const onSelectDayMock = jest.fn(); + + const initialDateObject = new Date(initialDate); + const selectableDateObject = new Date(selectableDate); + + [initialDateObject, selectableDateObject].forEach((dt) => { + dt.setHours(0); + dt.setMinutes(0); + dt.setSeconds(0); + dt.setMilliseconds(0); + }); + + const wrapper = mount( + + ); + expect(wrapper).toMatchSnapshot(); + + expect(wrapper.state().selectedDates).toEqual([initialDateObject, null]); + + wrapper.find(`[data-date="${nonSelectableDate}"]`).simulate('click'); + expect(wrapper.state().selectedDates).toEqual([initialDateObject, null]); + + wrapper.find(`[data-date="${selectableDate}"]`).simulate('click'); + expect(wrapper.state().selectedDates).toEqual([selectableDateObject, null]); + + expect(onSelectDayMock.mock.calls.length).toEqual(1); + expect(onSelectDayMock.mock.calls[0][0]).toBeInstanceOf(Array); + expect(onSelectDayMock.mock.calls[0][0][0]).toBeInstanceOf(Date); + expect(onSelectDayMock.mock.calls[0][0][1]).toEqual(null); + }); + + it('should merge the locale definition with the default one', () => { + const myLocale = { + weekDays: [ + { name: 'Domingo', short: 'Dom' }, + { name: 'Segunda', short: 'Seg' }, + { name: 'Terça', short: 'Ter' }, + { name: 'Quarta', short: 'Qua' }, + { name: 'Quinta', short: 'Qui' }, + { name: 'Sexta', short: 'Sex' }, + { name: 'Sábado', short: 'Sáb' }, + ], + }; + + const wrapper = mount( + + ); + expect(wrapper).toMatchSnapshot(); + + expect(wrapper.find('.ui-calendar-days__weekday').first().text()).toEqual('Seg'); + }); + + it('should merge the locale definition with the default one', () => { + const myLocale = { + startWeekDay: 0, + }; + + const wrapper = mount( + + ); + expect(wrapper).toMatchSnapshot(); + + expect(wrapper.find('.ui-calendar-days__weekday').first().text()).toEqual('Sun'); + }); + }); +}); diff --git a/tests/unit/calendar/calendar.range.spec.js b/tests/unit/calendar/calendar.range.spec.js new file mode 100644 index 00000000..7e503d35 --- /dev/null +++ b/tests/unit/calendar/calendar.range.spec.js @@ -0,0 +1,208 @@ +import { mount } from 'enzyme'; +import React from 'react'; +import Calendar from '../../../components/calendar/calendar'; + +describe('Calendar (range mode)', () => { + describe('#render()', () => { + it('should render the calendar with selectionType as range, initialized in the current date', () => { + const todayDate = new Date(); + todayDate.setHours(0); + todayDate.setMinutes(0); + todayDate.setSeconds(0); + todayDate.setMilliseconds(0); + + const wrapper = mount( + + ); + + expect(wrapper).toMatchSnapshot(); + expect(wrapper.props()).toEqual({ + dataAttrs: {}, + mods: [], + selectionType: 'range', + }); + expect(wrapper.state()).toEqual({ + maxLimit: null, + minLimit: null, + renderDate: todayDate, + selectedDates: [null, null], + }); + }); + + it('should set the minLimit to the same date as the first initialDates when provided', () => { + const initialDate = '2017-03-25'; + const initialDateObj = new Date(initialDate); + initialDateObj.setHours(0); + initialDateObj.setMinutes(0); + initialDateObj.setSeconds(0); + initialDateObj.setMilliseconds(0); + + const wrapper = mount( + + ); + + expect(wrapper).toMatchSnapshot(); + expect(wrapper.props()).toEqual({ + dataAttrs: {}, + initialDates: [initialDate], + mods: [], + selectionType: 'range', + }); + expect(wrapper.state()).toEqual({ + maxLimit: null, + minLimit: initialDateObj, + renderDate: initialDateObj, + selectedDates: [initialDateObj, null], + }); + }); + + it('should set the minLimit and dates properly and reset them at 3rd click', () => { + const todayDate = new Date(); + todayDate.setHours(0); + todayDate.setMinutes(0); + todayDate.setSeconds(0); + todayDate.setMilliseconds(0); + + const wrapper = mount( + + ); + + expect(wrapper).toMatchSnapshot(); + expect(wrapper.props()).toEqual({ + dataAttrs: {}, + mods: [], + selectionType: 'range', + }); + expect(wrapper.state()).toEqual({ + maxLimit: null, + minLimit: null, + renderDate: todayDate, + selectedDates: [null, null], + }); + + const expectedStartDate = new Date('2017-03-25'); + expectedStartDate.setHours(0); + expectedStartDate.setMinutes(0); + expectedStartDate.setSeconds(0); + expectedStartDate.setMilliseconds(0); + + const startRangeOption = wrapper.find('[data-date="2017-03-25"]'); + startRangeOption.simulate('click'); + expect(startRangeOption.props().className.includes('ui-calendar-days-option_selected-start')).toEqual(true); + expect(wrapper.state().minLimit).toEqual(expectedStartDate); + expect(wrapper.state().selectedDates[0]).toEqual(expectedStartDate); + expect(wrapper.find('[data-date="2017-03-24"]').props().disabled).toEqual(true); + + const expectedEndDate = new Date('2017-03-29'); + expectedEndDate.setHours(0); + expectedEndDate.setMinutes(0); + expectedEndDate.setSeconds(0); + expectedEndDate.setMilliseconds(0); + + // Selects the end date on the 2nd click + const endRangeOption = wrapper.find('[data-date="2017-03-29"]'); + endRangeOption.simulate('click'); + + const betweenRangeOption = wrapper.find('[data-date="2017-03-28"]'); + + expect(endRangeOption.props().className.includes('ui-calendar-days-option_selected-end')).toEqual(true); + expect(wrapper.state().selectedDates[1]).toEqual(expectedEndDate); + expect(betweenRangeOption.props().className.includes('ui-calendar-days-option_selected-between')).toEqual(true); + + // On 3rd click resets the calendar, removing the selection + betweenRangeOption.simulate('click'); + expect(wrapper.state().minLimit).toEqual(null); + expect(wrapper.state().selectedDates).toEqual([null, null]); + }); + + it('should render the selection as normal (not range) when start and end date are the same', () => { + const todayDate = new Date(); + todayDate.setHours(0); + todayDate.setMinutes(0); + todayDate.setSeconds(0); + todayDate.setMilliseconds(0); + + const wrapper = mount( + + ); + + const expectedStartDate = new Date('2017-03-25'); + expectedStartDate.setHours(0); + expectedStartDate.setMinutes(0); + expectedStartDate.setSeconds(0); + expectedStartDate.setMilliseconds(0); + + const startRangeOption = wrapper.find('[data-date="2017-03-25"]'); + startRangeOption.simulate('click'); + expect(startRangeOption.props().className.includes('ui-calendar-days-option_selected-start')).toEqual(true); + expect(wrapper.state().minLimit).toEqual(expectedStartDate); + expect(wrapper.state().selectedDates[0]).toEqual(expectedStartDate); + + const expectedEndDate = new Date('2017-03-25'); + expectedEndDate.setHours(0); + expectedEndDate.setMinutes(0); + expectedEndDate.setSeconds(0); + expectedEndDate.setMilliseconds(0); + + // Selects the end date on the 2nd click + const endRangeOption = wrapper.find('[data-date="2017-03-25"]'); + endRangeOption.simulate('click'); + + expect(endRangeOption.props().className.includes('ui-calendar-days-option_selected')).toEqual(true); + expect(wrapper.state().minLimit).toEqual(null); + expect(wrapper.state().selectedDates[1]).toEqual(expectedEndDate); + }); + + it('should put the minLimit back to the one passed on props, when resetting it', () => { + const todayDate = new Date(); + todayDate.setHours(0); + todayDate.setMinutes(0); + todayDate.setSeconds(0); + todayDate.setMilliseconds(0); + + const minDate = '2017-03-05'; + const expectedInitialMinLimit = new Date(minDate); + expectedInitialMinLimit.setHours(0); + expectedInitialMinLimit.setMinutes(0); + expectedInitialMinLimit.setSeconds(0); + expectedInitialMinLimit.setMilliseconds(0); + + const wrapper = mount( + + ); + + expect(wrapper.state().minLimit).toEqual(expectedInitialMinLimit); + + const expectedStartDate = new Date('2017-03-25'); + expectedStartDate.setHours(0); + expectedStartDate.setMinutes(0); + expectedStartDate.setSeconds(0); + expectedStartDate.setMilliseconds(0); + + const startRangeOption = wrapper.find('[data-date="2017-03-25"]'); + startRangeOption.simulate('click'); + expect(startRangeOption.props().className.includes('ui-calendar-days-option_selected-start')).toEqual(true); + expect(wrapper.state().minLimit).toEqual(expectedStartDate); + expect(wrapper.state().selectedDates[0]).toEqual(expectedStartDate); + + const expectedEndDate = new Date('2017-03-25'); + expectedEndDate.setHours(0); + expectedEndDate.setMinutes(0); + expectedEndDate.setSeconds(0); + expectedEndDate.setMilliseconds(0); + + // Selects the end date on the 2nd click + const endRangeOption = wrapper.find('[data-date="2017-03-25"]'); + endRangeOption.simulate('click'); + + expect(endRangeOption.props().className.includes('ui-calendar-days-option_selected')).toEqual(true); + expect(wrapper.state().minLimit).toEqual(expectedInitialMinLimit); + expect(wrapper.state().selectedDates[1]).toEqual(expectedEndDate); + + // And resets the dates with the 3rd click + wrapper.find('[data-date="2017-03-26"]').simulate('click'); + expect(wrapper.state().minLimit).toEqual(expectedInitialMinLimit); + expect(wrapper.state().selectedDates).toEqual([null, null]); + }); + }); +});