Skip to content

Commit

Permalink
test: add shortcut for pressing multiple keys simultaneously (#8536) (#…
Browse files Browse the repository at this point in the history 
…8588)
  • Loading branch information
@vursen
vursen authored Jan 29, 2025
1 parent 28ec6d4 commit 3f50a9c
Show file tree
Hide file tree
Showing 29 changed files with 140 additions and 256 deletions.
4 changes: 1 addition & 3 deletions packages/a11y-base/test/focus-trap-controller.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,9 +58,7 @@ async function tab() {
}

async function shiftTab() {
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
return document.activeElement;
}

Expand Down
4 changes: 1 addition & 3 deletions packages/app-layout/test/helpers.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,5 @@ export async function tab() {
}

export async function shiftTab() {
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
}
4 changes: 1 addition & 3 deletions packages/checkbox-group/test/checkbox-group.common.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -287,9 +287,7 @@ describe('vaadin-checkbox-group', () => {
await sendKeys({ press: 'Tab' });

// Move focus out of the checkbox group.
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

expect(checkboxes[0].hasAttribute('focused')).to.be.false;
expect(group.hasAttribute('focused')).to.be.false;
Expand Down
8 changes: 2 additions & 6 deletions packages/checkbox-group/test/validation.common.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,9 +82,7 @@ describe('validation', () => {
expect(validateSpy.called).to.be.false;

// Move focus out of the checkbox group.
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
expect(validateSpy.calledOnce).to.be.true;
});

Expand Down Expand Up @@ -132,9 +130,7 @@ describe('validation', () => {
await sendKeys({ press: 'Tab' });

// Move focus out of the checkbox group.
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

expect(validateSpy.called).to.be.false;
});
Expand Down
4 changes: 1 addition & 3 deletions packages/checkbox/test/validation.common.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -108,9 +108,7 @@ describe('validation', () => {
await sendKeys({ press: 'Tab' });

// Blur the checkbox.
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

expect(validateSpy.called).to.be.false;
});
Expand Down
4 changes: 1 addition & 3 deletions packages/component-base/test/virtualizer-reorder-elements.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -152,9 +152,7 @@ describe('reorder elements', () => {
// Tab upwards
for (let i = tabToIndex - 1; i >= 0; i--) {
await nextFrame();
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
await nextFrame();
expect(document.activeElement.id).to.equal(`item-${i}`);
}
Expand Down
4 changes: 1 addition & 3 deletions packages/context-menu/test/a11y.common.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,9 +79,7 @@ describe('a11y', () => {
it('should move focus to the prev element outside the menu on Shift+Tab pressed inside', async () => {
contextMenuButton.click();
await nextRender();
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
expect(getDeepActiveElement()).to.equal(firstGlobalFocusable);
});

Expand Down
72 changes: 20 additions & 52 deletions packages/dashboard/test/dashboard-keyboard.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,9 +88,7 @@ describe('dashboard - keyboard interaction', () => {
await sendKeys({ press: 'Space' });

// Focus the focus-button with shift + tab
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

// Click the focus-button
await sendKeys({ press: 'Space' });
Expand Down Expand Up @@ -158,9 +156,7 @@ describe('dashboard - keyboard interaction', () => {
it('should blur deselected widget on shift tab', async () => {
const widget = getElementFromCell(dashboard, 0, 0)!;
await sendKeys({ press: 'Escape' });
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
expect(widget.hasAttribute('selected')).to.be.false;
expect(widget.hasAttribute('focused')).to.be.false;
expect(widget.contains(document.activeElement)).to.be.false;
Expand Down Expand Up @@ -233,29 +229,23 @@ describe('dashboard - keyboard interaction', () => {
it('should increase the widget row span on shift + arrow down', async () => {
// Set minimum row height to enable vertical resizing
setMinimumRowHeight(dashboard, 100);
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'ArrowDown' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+ArrowDown' });
expect((dashboard.items[0] as DashboardItem).rowspan).to.equal(2);
});

it('should decrease the widget row span on shift + arrow up', async () => {
// Set minimum row height to enable vertical resizing
setMinimumRowHeight(dashboard, 100);
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'ArrowDown' });
await sendKeys({ press: 'Shift+ArrowDown' });
await updateComplete(dashboard);
await sendKeys({ press: 'ArrowUp' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+ArrowUp' });
expect((dashboard.items[0] as DashboardItem).rowspan).to.equal(1);
});

it('should dispatch an item resized event shift + arrow down', async () => {
const spy = sinon.spy();
dashboard.addEventListener('dashboard-item-resized', spy);
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'ArrowDown' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+ArrowDown' });
expect(spy.calledOnce).to.be.true;
expect(spy.firstCall.args[0].detail.item).to.eql({ id: 0 });
expect(spy.firstCall.args[0].detail.items).to.eql(dashboard.items);
Expand All @@ -266,23 +256,17 @@ describe('dashboard - keyboard interaction', () => {
const spy = sinon.spy();
// @ts-ignore unexpected event type
dashboard.addEventListener('item-resize', spy);
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'ArrowDown' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+ArrowDown' });
expect(spy.called).to.be.false;
});

it('should not increase the widget row span on shift + arrow down if row min height is not defined', async () => {
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'ArrowDown' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+ArrowDown' });
expect((dashboard.items[0] as DashboardItem).rowspan).to.not.equal(2);
});

it('should not move the widget on arrow down if ctrl key is pressed', async () => {
await sendKeys({ down: 'Control' });
await sendKeys({ press: 'ArrowDown' });
await sendKeys({ up: 'Control' });
await sendKeys({ press: 'Control+ArrowDown' });
expect(dashboard.items).to.eql([{ id: 0 }, { id: 1 }, { items: [{ id: 2 }, { id: 3 }] }]);
});

Expand Down Expand Up @@ -341,9 +325,7 @@ describe('dashboard - keyboard interaction', () => {
it('should release focus trap on deselect', async () => {
const widget = getElementFromCell(dashboard, 0, 0)!;
await sendKeys({ press: 'Escape' });
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
expect(widget.contains(document.activeElement)).to.be.false;
});

Expand All @@ -369,18 +351,14 @@ describe('dashboard - keyboard interaction', () => {
});

it('should increase the widget column span on shift + arrow forwards', async () => {
await sendKeys({ down: 'Shift' });
await sendKeys({ press: arrowForwards });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: `Shift+${arrowForwards}` });
expect((dashboard.items[0] as DashboardItem).colspan).to.equal(2);
});

it('should decrease the widget column span on shift + arrow backwards', async () => {
await sendKeys({ down: 'Shift' });
await sendKeys({ press: arrowForwards });
await sendKeys({ press: `Shift+${arrowForwards}` });
await updateComplete(dashboard);
await sendKeys({ press: arrowBackwards });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: `Shift+${arrowBackwards}` });
expect((dashboard.items[0] as DashboardItem).colspan).to.equal(1);
});
});
Expand Down Expand Up @@ -412,9 +390,7 @@ describe('dashboard - keyboard interaction', () => {

it('should blur deselected selected on shift tab', async () => {
await sendKeys({ press: 'Escape' });
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
expect(section.hasAttribute('selected')).to.be.false;
expect(section.hasAttribute('focused')).to.be.false;
expect(section.contains(document.activeElement)).to.be.false;
Expand Down Expand Up @@ -446,16 +422,12 @@ describe('dashboard - keyboard interaction', () => {

it('should release focus trap on deselect', async () => {
await sendKeys({ press: 'Escape' });
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
expect(section.contains(document.activeElement)).to.be.false;
});

it('should not increase the section row span on shift + arrow down', async () => {
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'ArrowDown' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+ArrowDown' });
expect(dashboard.items).to.eql([{ id: 0 }, { id: 1 }, { items: [{ id: 2 }, { id: 3 }] }]);
});
});
Expand Down Expand Up @@ -565,10 +537,8 @@ describe('dashboard - keyboard interaction', () => {
await sendKeys({ press: 'Space' });
await nextFrame();
// Focus backward button, click it
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
await sendKeys({ press: 'Shift+Tab' });
await nextFrame();

expect(getMoveBackwardButton(widget).matches(':focus')).to.be.true;
Expand Down Expand Up @@ -598,10 +568,8 @@ describe('dashboard - keyboard interaction', () => {
await sendKeys({ press: 'Space' });
await nextFrame();
// Focus backwards button, click it
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
await sendKeys({ press: 'Shift+Tab' });
await sendKeys({ press: 'Space' });
await nextFrame();

Expand Down
8 changes: 2 additions & 6 deletions packages/date-picker/test/fullscreen.common.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -157,9 +157,7 @@ describe('fullscreen mode', () => {
it('should move focus to Cancel button on date cell Shift Tab', async () => {
const spy = sinon.spy(overlayContent._cancelButton, 'focus');

await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

expect(spy.calledOnce).to.be.true;
});
Expand All @@ -169,9 +167,7 @@ describe('fullscreen mode', () => {
const spy = sinon.spy(cell, 'focus');

// Move focus to Cancel button
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

await sendKeys({ press: 'Tab' });

Expand Down
16 changes: 4 additions & 12 deletions packages/date-picker/test/keyboard-input.common.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -258,9 +258,7 @@ describe('keyboard', () => {

const spy = sinon.spy(input, 'focus');

await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

expect(spy.calledOnce).to.be.true;
});
Expand All @@ -273,19 +271,15 @@ describe('keyboard', () => {
});

it('should move focus to Cancel button on input Shift Tab', async () => {
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });
expect(overlayContent._cancelButton.hasAttribute('focused')).to.be.true;
});

it('should reveal the focused date on Today button Shift Tab', async () => {
const spy = sinon.spy(overlayContent, 'revealDate');
overlayContent._todayButton.focus();

await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

await aTimeout(1);
expect(spy.called).to.be.true;
Expand Down Expand Up @@ -328,9 +322,7 @@ describe('keyboard', () => {
overlayContent._todayButton.focus();

// Move focus to the calendar
await sendKeys({ down: 'Shift' });
await sendKeys({ press: 'Tab' });
await sendKeys({ up: 'Shift' });
await sendKeys({ press: 'Shift+Tab' });

await waitForScrollToFinish(datePicker);

Expand Down
Loading

0 comments on commit 3f50a9c

Please sign in to comment.