462 lines
14 KiB
JavaScript
462 lines
14 KiB
JavaScript
describe('keyboard operation - arrow-up', function () {
|
|
const replaceInput = () => {
|
|
const newInput = document.createElement('input');
|
|
testContainer.replaceChild(newInput, input);
|
|
return newInput;
|
|
};
|
|
let input;
|
|
|
|
beforeEach(function () {
|
|
input = document.createElement('input');
|
|
testContainer.appendChild(input);
|
|
});
|
|
|
|
afterEach(function () {
|
|
testContainer.removeChild(input);
|
|
});
|
|
|
|
it('moves the view date/month/year/decade to 1 step up side', function () {
|
|
const clock = sinon.useFakeTimers({now: new Date(2044, 5, 15)});
|
|
const {dp, picker} = createDP(input);
|
|
const viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', 'June 2044');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[10]]);
|
|
expect(cells[10].textContent, 'to be', '8');
|
|
|
|
viewSwitch.click();
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2044');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[1]]);
|
|
|
|
viewSwitch.click();
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2040-2049');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[1]]);
|
|
expect(cells[1].textContent, 'to be', '2040');
|
|
|
|
viewSwitch.click();
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2000-2090');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[1]]);
|
|
expect(cells[1].textContent, 'to be', '2000');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
});
|
|
|
|
it('also changes month of the days view if the current view date <= 7th', function () {
|
|
let clock = sinon.useFakeTimers({now: new Date(2020, 2, 1)});
|
|
let {dp, picker} = createDP(input);
|
|
let viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', 'February 2020');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[28]]);
|
|
expect(cells[28].textContent, 'to be', '23');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2020, 2, 4)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', 'February 2020');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[31]]);
|
|
expect(cells[31].textContent, 'to be', '26');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2020, 2, 7)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', 'February 2020');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[34]]);
|
|
expect(cells[34].textContent, 'to be', '29');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
});
|
|
|
|
it('also changes year of the months view if the current view month is Jan/Feb/Mar/Apr', function () {
|
|
let clock = sinon.useFakeTimers({now: new Date(2020, 0, 1)});
|
|
let {dp, picker} = createDP(input);
|
|
let viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2019');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[8]]);
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2020, 1, 1)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2019');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[9]]);
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2020, 2, 1)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2019');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[10]]);
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2020, 3, 1)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2019');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[11]]);
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
});
|
|
|
|
it('also changes decade of the years view if the current view year is the first 4 of the decade', function () {
|
|
let clock = sinon.useFakeTimers({now: new Date(2020, 1, 1)});
|
|
let {dp, picker} = createDP(input);
|
|
let viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2010-2019');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[7]]);
|
|
expect(cells[7].textContent, 'to be', '2016');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2022, 1, 1)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2010-2019');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[9]]);
|
|
expect(cells[9].textContent, 'to be', '2018');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2023, 1, 1)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '2010-2019');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[10]]);
|
|
expect(cells[10].textContent, 'to be', '2019');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
});
|
|
|
|
it('also changes century of the decades view if the current view decade is the first 4 of the century', function () {
|
|
let clock = sinon.useFakeTimers({now: new Date(2000, 1, 1)});
|
|
let {dp, picker} = createDP(input);
|
|
let viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '1900-1990');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[7]]);
|
|
expect(cells[7].textContent, 'to be', '1960');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2020, 1, 1)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '1900-1990');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[9]]);
|
|
expect(cells[9].textContent, 'to be', '1980');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
input = replaceInput();
|
|
|
|
clock = sinon.useFakeTimers({now: new Date(2030, 1, 1)});
|
|
({dp, picker} = createDP(input));
|
|
viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '1900-1990');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[10]]);
|
|
expect(cells[10].textContent, 'to be', '1990');
|
|
|
|
dp.destroy();
|
|
clock.restore();
|
|
});
|
|
|
|
it('does nothing if the current view date <= 0000-01-07 in the days view', function () {
|
|
input.value = '01/01/0000';
|
|
|
|
const {dp, picker} = createDP(input);
|
|
const viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', 'January 0');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[6]]);
|
|
expect(cells[6].textContent, 'to be', '1');
|
|
|
|
dp.setDate('01/07/0000');
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', 'January 0');
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[12]]);
|
|
expect(cells[12].textContent, 'to be', '7');
|
|
|
|
dp.destroy();
|
|
});
|
|
|
|
it('does nothing if the current view month <= April 0000 in the months view', function () {
|
|
input.value = '01/01/0000';
|
|
|
|
const {dp, picker} = createDP(input);
|
|
const viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '0');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[0]]);
|
|
|
|
dp.setDate('04/07/0000');
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '0');
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[3]]);
|
|
|
|
dp.destroy();
|
|
});
|
|
|
|
it('does nothing if the current view year <= 0004 in the years view', function () {
|
|
input.value = '01/01/0000';
|
|
|
|
const {dp, picker} = createDP(input);
|
|
const viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '0-9');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[1]]);
|
|
expect(cells[1].textContent, 'to be', '0');
|
|
|
|
dp.setDate('04/07/0004');
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '0-9');
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[5]]);
|
|
expect(cells[5].textContent, 'to be', '4');
|
|
|
|
dp.destroy();
|
|
});
|
|
|
|
it('does nothing if the current view decade <= 0040 in the decades view', function () {
|
|
input.value = '01/01/0000';
|
|
|
|
const {dp, picker} = createDP(input);
|
|
const viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowLeft'});
|
|
expect(viewSwitch.textContent, 'to be', '0-90');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[1]]);
|
|
expect(cells[1].textContent, 'to be', '0');
|
|
|
|
dp.setDate('04/07/0047');
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
viewSwitch.click();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp'});
|
|
expect(viewSwitch.textContent, 'to be', '0-90');
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[5]]);
|
|
expect(cells[5].textContent, 'to be', '40');
|
|
|
|
dp.destroy();
|
|
});
|
|
|
|
describe('with control', function () {
|
|
it('functions as the shortcut key of the view switch', function () {
|
|
const clock = sinon.useFakeTimers({now: new Date(2020, 3, 22)});
|
|
const {dp, picker} = createDP(input);
|
|
const viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp', ctrlKey: true});
|
|
expect(viewSwitch.textContent, 'to be', '2020');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[3]]);
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp', ctrlKey: true});
|
|
expect(viewSwitch.textContent, 'to be', '2020-2029');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[1]]);
|
|
expect(cells[1].textContent, 'to be', '2020');
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp', ctrlKey: true});
|
|
expect(viewSwitch.textContent, 'to be', '2000-2090');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[3]]);
|
|
expect(cells[3].textContent, 'to be', '2020');
|
|
|
|
// does nothig if the view has reached to the max view
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp', ctrlKey: true});
|
|
expect(viewSwitch.textContent, 'to be', '2000-2090');
|
|
|
|
dp.destroy();
|
|
clock.reset();
|
|
});
|
|
});
|
|
|
|
describe('with meta', function () {
|
|
it('functions as a substitute for the "+ctrl" key combination', function () {
|
|
const clock = sinon.useFakeTimers({now: new Date(2020, 3, 22)});
|
|
const {dp, picker} = createDP(input);
|
|
const viewSwitch = getViewSwitch(picker);
|
|
input.focus();
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp', metaKey: true});
|
|
expect(viewSwitch.textContent, 'to be', '2020');
|
|
|
|
let cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[3]]);
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp', metaKey: true});
|
|
expect(viewSwitch.textContent, 'to be', '2020-2029');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[1]]);
|
|
expect(cells[1].textContent, 'to be', '2020');
|
|
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp', metaKey: true});
|
|
expect(viewSwitch.textContent, 'to be', '2000-2090');
|
|
|
|
cells = getCells(picker);
|
|
expect(filterCells(cells, '.focused'), 'to equal', [cells[3]]);
|
|
expect(cells[3].textContent, 'to be', '2020');
|
|
|
|
// does nothig if the view has reached to the max view
|
|
simulant.fire(input, 'keydown', {key: 'ArrowUp', metaKey: true});
|
|
expect(viewSwitch.textContent, 'to be', '2000-2090');
|
|
|
|
dp.destroy();
|
|
clock.reset();
|
|
});
|
|
});
|
|
});
|