ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

test(tooltip): dismissable on escape keypress

Browse source
This commit is contained in:
Marcos Gil 2020-02-04 08:59:01 +01:00 committed by Thomas Allmer
parent e7406054fc
commit 13a43fa402
1 changed files with 35 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
packages/tooltip/test/lion-tooltip.test.js
View file

@ -85,6 +85,41 @@ describe('lion-tooltip', () => {
expect(el._overlayCtrl.isShown).to.equal(true); expect(el._overlayCtrl.isShown).to.equal(true);
}); });
it('should show content on focusin and hide on Escape key press', async () => {
const el = await fixture(html`
<lion-tooltip>
<div slot="content">Hey there</div>
<button slot="invoker">Tooltip button</button>
</lion-tooltip>
`);
const invoker = Array.from(el.children).find(child => child.slot === 'invoker');
const eventFocusIn = new Event('focusin');
invoker.dispatchEvent(eventFocusIn);
await el.updateComplete;
expect(el._overlayCtrl.isShown).to.equal(true);
const eventEscapeKeypress = new KeyboardEvent('keyup', { key: 'Escape' });
invoker.dispatchEvent(eventEscapeKeypress);
await el.updateComplete;
expect(el._overlayCtrl.isShown).to.equal(false);
});
it('should show content on mouseenter and hide on Escape key press', async () => {
const el = await fixture(html`
<lion-tooltip>
<div slot="content">Hey there</div>
<button slot="invoker">Tooltip button</button>
</lion-tooltip>
`);
const eventMouseEnter = new Event('mouseenter');
el.dispatchEvent(eventMouseEnter);
await el.updateComplete;
expect(el._overlayCtrl.isShown).to.equal(true);
const eventEscapeKeypress = new KeyboardEvent('keyup', { key: 'Escape' });
document.dispatchEvent(eventEscapeKeypress);
await el.updateComplete;
expect(el._overlayCtrl.isShown).to.equal(false);
});
it('should tooltip contains html when specified in tooltip content body', async () => { it('should tooltip contains html when specified in tooltip content body', async () => {
const el = await fixture(html` const el = await fixture(html`
<lion-tooltip> <lion-tooltip>