Skip to content
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

test: add shortcut for pressing multiple keys simultaneously #8536

Merged
merged 8 commits into from
Jan 29, 2025
Merged

test: add shortcut for pressing multiple keys simultaneously #8536

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
a5bbde0
test: add shortcut for sending keys with modifiers
vursen Jan 27, 2025
5af3d07
replace more occurences
vursen Jan 27, 2025
8cc6b75
replace one more occurence
vursen Jan 27, 2025
b753edf
apply shortcut only when multiple keys are provided
vursen Jan 27, 2025
3baf97a
decorate new sendKeys with JSDoc
vursen Jan 27, 2025
4dbf627
add a few examples
vursen Jan 27, 2025
f93b428
update incorrect examples
vursen Jan 27, 2025
b7e2931
replace one more occurence
vursen Jan 28, 2025
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
4 changes: 1 addition & 3 deletions packages/a11y-base/test/focus-trap-controller.test.js
View file
Open in desktop
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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Loading