describe('DateRangePicker - options', function () { let clock; let elem; let input0; let input1; before(function () { clock = sinon.useFakeTimers({now: new Date(2020, 1, 14)}); }); after(function () { clock.restore(); }); beforeEach(function () { elem = domUtils.parseHTML('
').firstChild; [input0, input1] = elem.children; testContainer.appendChild(elem); }); afterEach(function () { testContainer.removeChild(elem); }); describe('allowOneSidedRange', function () { it('disables the requirement for both sides of range to be set/unset', function () { let {drp, picker0, picker1} = createDRP(elem, {allowOneSidedRange: true}); let cells0 = getCells(picker0); let cells1 = getCells(picker1); drp.datepickers[0].show(); cells0[16].click(); expect(drp.dates, 'to equal', [dateValue(2020, 1, 11), undefined]); expect(drp.getDates(), 'to equal', [new Date(drp.dates[0]), undefined]); expect(input0.value, 'to be', '02/11/2020'); expect(filterCells(cells0, '.selected'), 'to equal', [cells0[16]]); expect(filterCells(cells0, '.range-start'), 'to equal', [cells0[16]]); expect(filterCells(cells0, '.range-end'), 'to equal', []); expect(filterCells(cells0, '.range'), 'to equal', []); expect(filterCells(cells0, '.focused'), 'to equal', [cells0[16]]); expect(input1.value, 'to be', ''); expect(filterCells(cells1, '.selected'), 'to equal', []); expect(filterCells(cells1, '.range-start'), 'to equal', [cells1[16]]); expect(filterCells(cells1, '.range-end'), 'to equal', []); expect(filterCells(cells1, '.range'), 'to equal', []); expect(filterCells(cells1, '.focused'), 'to equal', [cells1[19]]); drp.datepickers[1].show(); cells1[25].click(); expect(drp.dates, 'to equal', [dateValue(2020, 1, 11), dateValue(2020, 1, 20)]); expect(drp.getDates(), 'to equal', drp.dates.map(date => new Date(date))); expect(input0.value, 'to be', '02/11/2020'); expect(filterCells(cells0, '.selected'), 'to equal', [cells0[16]]); expect(filterCells(cells0, '.range-start'), 'to equal', [cells0[16]]); expect(filterCells(cells0, '.range-end'), 'to equal', [cells0[25]]); expect(filterCells(cells0, '.range'), 'to equal', cells0.slice(17, 25)); expect(filterCells(cells0, '.focused'), 'to equal', [cells0[16]]); expect(input1.value, 'to be', '02/20/2020'); expect(filterCells(cells1, '.selected'), 'to equal', [cells1[25]]); expect(filterCells(cells1, '.range-start'), 'to equal', [cells1[16]]); expect(filterCells(cells1, '.range-end'), 'to equal', [cells1[25]]); expect(filterCells(cells1, '.range'), 'to equal', cells1.slice(17, 25)); expect(filterCells(cells1, '.focused'), 'to equal', [cells1[25]]); simulant.fire(input0, 'keydown', {key: 'Escape'}); input0.value = ''; simulant.fire(input0, 'keydown', {key: 'Enter'}); expect(drp.dates, 'to equal', [undefined, dateValue(2020, 1, 20)]); expect(drp.getDates(), 'to equal', [undefined, new Date(drp.dates[1])]); expect(input0.value, 'to be', ''); expect(filterCells(cells0, '.selected'), 'to equal', []); expect(filterCells(cells0, '.range-start'), 'to equal', []); expect(filterCells(cells0, '.range-end'), 'to equal', [cells0[25]]); expect(filterCells(cells0, '.range'), 'to equal', []); expect(filterCells(cells0, '.focused'), 'to equal', [cells0[19]]); expect(input1.value, 'to be', '02/20/2020'); expect(filterCells(cells1, '.selected'), 'to equal', [cells1[25]]); expect(filterCells(cells1, '.range-start'), 'to equal', []); expect(filterCells(cells1, '.range-end'), 'to equal', [cells1[25]]); expect(filterCells(cells1, '.range'), 'to equal', []); expect(filterCells(cells1, '.focused'), 'to equal', [cells1[25]]); drp.destroy(); input0.value = ''; input1.value = ''; // by setDates() ({drp, picker0, picker1} = createDRP(elem, {allowOneSidedRange: true})); cells0 = getCells(picker0); cells1 = getCells(picker1); drp.setDates('02/11/2020'); expect(drp.dates, 'to equal', [dateValue(2020, 1, 11), undefined]); expect(input0.value, 'to be', '02/11/2020'); expect(filterCells(cells0, '.selected'), 'to equal', [cells0[16]]); expect(input1.value, 'to be', ''); expect(filterCells(cells1, '.selected'), 'to equal', []); drp.setDates(undefined, '02/20/2020'); expect(drp.dates, 'to equal', [dateValue(2020, 1, 11), dateValue(2020, 1, 20)]); expect(input0.value, 'to be', '02/11/2020'); expect(filterCells(cells0, '.selected'), 'to equal', [cells0[16]]); expect(input1.value, 'to be', '02/20/2020'); expect(filterCells(cells1, '.selected'), 'to equal', [cells1[25]]); drp.setDates({clear: true}); expect(drp.dates, 'to equal', [undefined, dateValue(2020, 1, 20)]); expect(input0.value, 'to be', ''); expect(filterCells(cells0, '.selected'), 'to equal', []); expect(input1.value, 'to be', '02/20/2020'); expect(filterCells(cells1, '.selected'), 'to equal', [cells1[25]]); drp.setDates('02/11/2020', {clear: true}); expect(drp.dates, 'to equal', [dateValue(2020, 1, 11), undefined]); expect(input0.value, 'to be', '02/11/2020'); expect(filterCells(cells0, '.selected'), 'to equal', [cells0[16]]); expect(input1.value, 'to be', ''); expect(filterCells(cells1, '.selected'), 'to equal', []); drp.setDates({clear: true}, '02/20/2020'); expect(drp.dates, 'to equal', [undefined, dateValue(2020, 1, 20)]); expect(input0.value, 'to be', ''); expect(filterCells(cells0, '.selected'), 'to equal', []); expect(input1.value, 'to be', '02/20/2020'); expect(filterCells(cells1, '.selected'), 'to equal', [cells1[25]]); drp.setDates(undefined, {clear: true}); expect(drp.dates, 'to equal', [undefined, undefined]); expect(input0.value, 'to be', ''); expect(filterCells(cells0, '.selected'), 'to equal', []); expect(input1.value, 'to be', ''); expect(filterCells(cells1, '.selected'), 'to equal', []); drp.destroy(); }); it('can be updated with setOptions()', function () { const drp = new DateRangePicker(elem); drp.setOptions({allowOneSidedRange: true}); input0.value = '02/11/2020'; simulant.fire(input0, 'keydown', {key: 'Enter'}); expect(drp.dates, 'to equal', [dateValue(2020, 1, 11), undefined]); drp.setDates({clear: true}, '02/11/2020'); expect(drp.dates, 'to equal', [undefined, dateValue(2020, 1, 11)]); drp.setOptions({allowOneSidedRange: false}); input1.value = '02/20/2020'; simulant.fire(input1, 'keydown', {key: 'Enter'}); expect(drp.dates, 'to equal', [dateValue(2020, 1, 20), dateValue(2020, 1, 20)]); drp.setDates({clear: true}); expect(drp.dates, 'to equal', [undefined, undefined]); drp.destroy(); }); }); describe('pickLevel', function () { it('changes the span of range selection to 1st of a month → last day of a month when 1', function () { input0.value = '2/14/2020'; input1.value = '2/14/2020'; const {drp, picker0, picker1} = createDRP(elem, {pickLevel: 1}); const viewSwitch0 = picker0.querySelector('.view-switch'); const viewSwitch1 = picker1.querySelector('.view-switch'); let cells0 = getCells(picker0); let cells1 = getCells(picker1); input0.focus(); expect(drp.dates, 'to equal', [dateValue(2020, 1, 1), dateValue(2020, 1, 29)]); expect(input0.value, 'to be', '02/01/2020'); expect(viewSwitch0.textContent, 'to be', '2020'); expect(getCellIndices(cells0, '.selected'), 'to equal', [1]); expect(getCellIndices(cells0, '.range-start'), 'to equal', [1]); expect(getCellIndices(cells0, '.range-end'), 'to equal', [1]); expect(getCellIndices(cells0, '.range'), 'to equal', []); expect(getCellIndices(cells0, '.focused'), 'to equal', [1]); input1.focus(); expect(input1.value, 'to be', '02/29/2020'); expect(viewSwitch1.textContent, 'to be', '2020'); expect(getCellIndices(cells1, '.selected'), 'to equal', [1]); expect(getCellIndices(cells1, '.range-start'), 'to equal', [1]); expect(getCellIndices(cells1, '.range-end'), 'to equal', [1]); expect(getCellIndices(cells1, '.range'), 'to equal', []); expect(getCellIndices(cells1, '.focused'), 'to equal', [1]); // mouse operation cells0[0].click(); cells1[6].click(); expect(drp.dates, 'to equal', [dateValue(2020, 0, 1), dateValue(2020, 6, 31)]); expect(input0.value, 'to be', '01/01/2020'); expect(viewSwitch0.textContent, 'to be', '2020'); expect(getCellIndices(cells0, '.selected'), 'to equal', [0]); expect(getCellIndices(cells0, '.range-start'), 'to equal', [0]); expect(getCellIndices(cells0, '.range-end'), 'to equal', [6]); input1.focus(); expect(input1.value, 'to be', '07/31/2020'); expect(viewSwitch1.textContent, 'to be', '2020'); expect(getCellIndices(cells1, '.selected'), 'to equal', [6]); expect(getCellIndices(cells1, '.range-start'), 'to equal', [0]); expect(getCellIndices(cells1, '.range-end'), 'to equal', [6]); // api call drp.setDates('2/14/2021', '3/14/2020'); expect(drp.dates, 'to equal', [dateValue(2020, 2, 1), dateValue(2021, 1, 28)]); expect(input0.value, 'to be', '03/01/2020'); expect(viewSwitch0.textContent, 'to be', '2020'); expect(getCellIndices(cells0, '.selected'), 'to equal', [2]); expect(getCellIndices(cells0, '.range-start'), 'to equal', [2]); expect(getCellIndices(cells0, '.range-end'), 'to equal', []); input1.focus(); expect(input1.value, 'to be', '02/28/2021'); expect(viewSwitch1.textContent, 'to be', '2021'); expect(getCellIndices(cells1, '.selected'), 'to equal', [1]); expect(getCellIndices(cells1, '.range-start'), 'to equal', []); expect(getCellIndices(cells1, '.range-end'), 'to equal', [1]); drp.destroy(); }); it('changes the span of range selection to Jan 1st of a month → Dec 31st of a month when 2', function () { input0.value = '2/14/2020'; input1.value = '2/14/2020'; const {drp, picker0, picker1} = createDRP(elem, {pickLevel: 2}); const viewSwitch0 = picker0.querySelector('.view-switch'); const viewSwitch1 = picker1.querySelector('.view-switch'); let cells0 = getCells(picker0); let cells1 = getCells(picker1); input0.focus(); expect(drp.dates, 'to equal', [dateValue(2020, 0, 1), dateValue(2020, 11, 31)]); expect(input0.value, 'to be', '01/01/2020'); expect(viewSwitch0.textContent, 'to be', '2020-2029'); expect(getCellIndices(cells0, '.selected'), 'to equal', [1]); expect(getCellIndices(cells0, '.range-start'), 'to equal', [1]); expect(getCellIndices(cells0, '.range-end'), 'to equal', [1]); expect(getCellIndices(cells0, '.range'), 'to equal', []); expect(getCellIndices(cells0, '.focused'), 'to equal', [1]); input1.focus(); expect(input1.value, 'to be', '12/31/2020'); expect(viewSwitch1.textContent, 'to be', '2020-2029'); expect(getCellIndices(cells1, '.selected'), 'to equal', [1]); expect(getCellIndices(cells1, '.range-start'), 'to equal', [1]); expect(getCellIndices(cells1, '.range-end'), 'to equal', [1]); expect(getCellIndices(cells1, '.range'), 'to equal', []); expect(getCellIndices(cells1, '.focused'), 'to equal', [1]); // mouse operation cells0[0].click(); cells1[3].click(); expect(drp.dates, 'to equal', [dateValue(2019, 0, 1), dateValue(2022, 11, 31)]); expect(input0.value, 'to be', '01/01/2019'); expect(viewSwitch0.textContent, 'to be', '2010-2019'); expect(getCellIndices(cells0, '.selected'), 'to equal', [10]); expect(getCellIndices(cells0, '.range-start'), 'to equal', [10]); expect(getCellIndices(cells0, '.range-end'), 'to equal', []); input1.focus(); expect(input1.value, 'to be', '12/31/2022'); expect(viewSwitch1.textContent, 'to be', '2020-2029'); expect(getCellIndices(cells1, '.selected'), 'to equal', [3]); expect(getCellIndices(cells1, '.range-start'), 'to equal', [0]); expect(getCellIndices(cells1, '.range-end'), 'to equal', [3]); // api call drp.setDates('2/14/2025', '3/14/2021'); expect(drp.dates, 'to equal', [dateValue(2021, 0, 1), dateValue(2025, 11, 31)]); expect(input0.value, 'to be', '01/01/2021'); expect(viewSwitch0.textContent, 'to be', '2020-2029'); expect(getCellIndices(cells0, '.selected'), 'to equal', [2]); expect(getCellIndices(cells0, '.range-start'), 'to equal', [2]); expect(getCellIndices(cells0, '.range-end'), 'to equal', [6]); input1.focus(); expect(input1.value, 'to be', '12/31/2025'); expect(viewSwitch1.textContent, 'to be', '2020-2029'); expect(getCellIndices(cells1, '.selected'), 'to equal', [6]); expect(getCellIndices(cells1, '.range-start'), 'to equal', [2]); expect(getCellIndices(cells1, '.range-end'), 'to equal', [6]); drp.destroy(); }); }); });