chore(overlays): cleanup some tests and demos

This commit is contained in:
Joren Broekema 2019-06-27 15:42:09 +02:00
parent c01cfe9ebb
commit 1e9ec400dd
7 changed files with 11 additions and 16 deletions

View file

@ -141,6 +141,8 @@ export class LocalOverlayController {
}
this.contentNode.id = this.contentId;
this.contentNode.style.display = 'inline-block';
/* To display on top of elements with no z-index that are appear later in the DOM */
this.contentNode.style.zIndex = 1;
this.invokerNode.setAttribute('aria-expanded', true);
if (this.trapsKeyboardFocus) this._setupTrapsKeyboardFocus();

View file

@ -119,9 +119,9 @@ storiesOf('Local Overlay System|Local Overlay Placement', module)
${popupController.invoker} ${popupController.content}
</div>
`;
})
/* TODO: Add this when we have a feature in place that adds scrollbars / overflow when no space is available */
.add('Space not available', () => {
});
/* TODO: Add this when we have a feature in place that adds scrollbars / overflow when no space is available */
/* .add('Space not available', () => {
const popupController = overlays.add(
new LocalOverlayController({
hidesOnEsc: true,
@ -153,4 +153,4 @@ storiesOf('Local Overlay System|Local Overlay Placement', module)
${popupController.invoker} ${popupController.content}
</div>
`;
});
}); */

View file

@ -40,8 +40,6 @@ const popupDemoStyle = css`
background-color: black;
border-radius: 4px;
padding: 8px;
/* To display on top of elements with no z-index that are appear later in the DOM */
z-index: 1;
}
@media (max-width: 480px) {

View file

@ -1,4 +1,4 @@
import { expect, fixture, html, aTimeout } from '@open-wc/testing';
import { expect, fixture, html } from '@open-wc/testing';
import '../lion-popup.js';
@ -25,7 +25,7 @@ describe('lion-popup', () => {
const eventOnClick = new Event('click');
invoker.dispatchEvent(eventOnClick);
await el.updateComplete;
await aTimeout();
expect(el.querySelector('[slot="content"]').style.display).to.be.equal('inline-block');
invoker.dispatchEvent(eventOnClick);
await el.updateComplete;
@ -55,9 +55,9 @@ describe('lion-popup', () => {
`);
await el._controller.show();
expect(el._controller._popper.options.placement).to.equal('top');
el.placementConfig = { placement: 'left' };
// placementConfig setter calls updateConfig method which recreates popper instance and this process is async..
await aTimeout();
await el._controller.show();
expect(el._controller._popper.options.placement).to.equal('left');
});
});

View file

@ -40,8 +40,6 @@ const tooltipDemoStyle = css`
background-color: black;
border-radius: 4px;
padding: 8px;
/* To display on top of elements with no z-index that are appear later in the DOM */
z-index: 1;
}
@media (max-width: 480px) {

View file

@ -1,4 +1,4 @@
import { expect, fixture, html, aTimeout } from '@open-wc/testing';
import { expect, fixture, html } from '@open-wc/testing';
import '../lion-tooltip.js';
@ -25,7 +25,6 @@ describe('lion-tooltip', () => {
const eventMouseEnter = new Event('mouseenter');
invoker.dispatchEvent(eventMouseEnter);
await el.updateComplete;
await aTimeout();
expect(el.querySelector('[slot="content"]').style.display).to.be.equal('inline-block');
const eventMouseLeave = new Event('mouseleave');
invoker.dispatchEvent(eventMouseLeave);
@ -62,12 +61,10 @@ describe('lion-tooltip', () => {
const eventFocusIn = new Event('focusin');
invoker.dispatchEvent(eventFocusIn);
await el.updateComplete;
await aTimeout();
expect(el.querySelector('[slot="content"]').style.display).to.be.equal('inline-block');
const eventFocusOut = new Event('focusout');
invoker.dispatchEvent(eventFocusOut);
await el.updateComplete;
await aTimeout();
expect(el.querySelector('[slot="content"]').style.display).to.be.equal('none');
});