Skip to content

Commit

Permalink
test: update date-picker tests to support async overlay (#6270)
Browse files Browse the repository at this point in the history
  • Loading branch information
web-padawan authored Jul 31, 2023
1 parent e9aea39 commit 201d98c
Show file tree
Hide file tree
Showing 3 changed files with 37 additions and 2 deletions.
21 changes: 21 additions & 0 deletions packages/date-picker/test/dropdown.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import {
fixtureSync,
mousedown,
nextRender,
nextUpdate,
oneEvent,
outsideClick,
touchstart,
Expand Down Expand Up @@ -33,6 +34,7 @@ describe('dropdown', () => {
it('should detach overlay on datePicker detach', async () => {
await open(datePicker);
datePicker.parentElement.removeChild(datePicker);
await nextUpdate(datePicker);
expect(overlay.parentElement).to.not.be.ok;
});

Expand All @@ -55,6 +57,8 @@ describe('dropdown', () => {
await oneEvent(overlay, 'vaadin-overlay-open');

toggleButton.click();
await nextUpdate(datePicker);

expect(datePicker.opened).to.be.false;
expect(overlay.opened).to.be.false;
});
Expand All @@ -68,6 +72,8 @@ describe('dropdown', () => {
describe('scroll to date', () => {
it('should scroll to today by default', async () => {
datePicker.open();
await nextUpdate(datePicker);

const spy = sinon.spy(datePicker._overlayContent, 'scrollToDate');
await oneEvent(overlay, 'vaadin-overlay-open');
await waitForOverlayRender();
Expand All @@ -80,6 +86,8 @@ describe('dropdown', () => {
datePicker.initialPosition = '2016-01-01';

datePicker.open();
await nextUpdate(datePicker);

const spy = sinon.spy(datePicker._overlayContent, 'scrollToDate');
await oneEvent(overlay, 'vaadin-overlay-open');
await waitForOverlayRender();
Expand All @@ -92,6 +100,8 @@ describe('dropdown', () => {
datePicker.value = '2000-02-01';

datePicker.open();
await nextUpdate(datePicker);

const spy = sinon.spy(datePicker._overlayContent, 'scrollToDate');
await oneEvent(overlay, 'vaadin-overlay-open');
await waitForOverlayRender();
Expand All @@ -114,6 +124,7 @@ describe('dropdown', () => {

it('should scroll to date on reopen', async () => {
datePicker.open();
await nextUpdate(datePicker);

// We must scroll to initial position on reopen because
// scrollTop can be reset while the dropdown is closed.
Expand All @@ -134,6 +145,8 @@ describe('dropdown', () => {
datePicker.min = '2100-01-01';

datePicker.open();
await nextUpdate(datePicker);

const spy = sinon.spy(datePicker._overlayContent, 'scrollToDate');
await oneEvent(overlay, 'vaadin-overlay-open');
await waitForOverlayRender();
Expand All @@ -146,6 +159,8 @@ describe('dropdown', () => {
datePicker.max = '2000-01-01';

datePicker.open();
await nextUpdate(datePicker);

const spy = sinon.spy(datePicker._overlayContent, 'scrollToDate');
await oneEvent(overlay, 'vaadin-overlay-open');
await waitForOverlayRender();
Expand All @@ -161,6 +176,8 @@ describe('dropdown', () => {
datePicker.initialPosition = '2015-01-01';

datePicker.open();
await nextUpdate(datePicker);

const spy = sinon.spy(datePicker._overlayContent, 'scrollToDate');
await oneEvent(overlay, 'vaadin-overlay-open');
await waitForOverlayRender();
Expand All @@ -175,6 +192,7 @@ describe('dropdown', () => {
input.focus();
await open(datePicker);
outsideClick();
await nextUpdate(datePicker);
await aTimeout(0);
expect(document.activeElement).to.equal(input);
});
Expand All @@ -183,6 +201,7 @@ describe('dropdown', () => {
expect(document.activeElement).to.equal(document.body);
await open(datePicker);
outsideClick();
await nextUpdate(datePicker);
await aTimeout(0);
expect(document.activeElement).to.equal(input);
});
Expand All @@ -192,6 +211,7 @@ describe('dropdown', () => {
await sendKeys({ press: 'Tab' });
await open(datePicker);
outsideClick();
await nextUpdate(datePicker);
await aTimeout(0);
expect(datePicker.hasAttribute('focus-ring')).to.be.true;
});
Expand Down Expand Up @@ -295,6 +315,7 @@ describe('dropdown', () => {
it('should disable virtual keyboard on close', async () => {
await open(datePicker);
datePicker.close();
await nextUpdate(datePicker);
expect(input.inputMode).to.equal('none');
});

Expand Down
2 changes: 1 addition & 1 deletion packages/date-picker/test/keyboard-input.test.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { expect } from '@esm-bundle/chai';
import { aTimeout, enter, fixtureSync, listenOnce, nextRender, tap } from '@vaadin/testing-helpers';
import { aTimeout, enter, fixtureSync, listenOnce, nextRender, nextUpdate, tap } from '@vaadin/testing-helpers';
import { sendKeys } from '@web/test-runner-commands';
import sinon from 'sinon';
import './not-animated-styles.js';
Expand Down
16 changes: 15 additions & 1 deletion packages/date-picker/test/validation.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -117,10 +117,12 @@ describe('validation', () => {
expect(validateSpy.calledBefore(changeSpy)).to.be.true;
});

it('should validate on outside click', () => {
it('should validate on outside click', async () => {
input.focus();
input.click();
await waitForOverlayRender();
outsideClick();
await nextUpdate(datePicker);
expect(validateSpy.calledOnce).to.be.true;
});

Expand All @@ -131,6 +133,7 @@ describe('validation', () => {
await sendKeys({ type: '1/1/2023' });
await waitForScrollToFinish(datePicker._overlayContent);
outsideClick();
await nextUpdate(datePicker);
expect(changeSpy.calledOnce).to.be.true;
expect(validateSpy.calledOnce).to.be.true;
expect(validateSpy.calledBefore(changeSpy)).to.be.true;
Expand Down Expand Up @@ -306,13 +309,15 @@ describe('validation', () => {
setInputValue(datePicker, '1/1/2022');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.false;
});

it('should be invalid when trying to commit an invalid date', async () => {
setInputValue(datePicker, 'foo');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.true;
});

Expand All @@ -321,6 +326,7 @@ describe('validation', () => {
setInputValue(datePicker, 'foo');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.value).to.equal('');
expect(input.value).to.equal('foo');
});
Expand Down Expand Up @@ -388,6 +394,7 @@ describe('validation', () => {
setInputValue(datePicker, '1/1/2000');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.false;
});

Expand All @@ -399,6 +406,7 @@ describe('validation', () => {
setInputValue(datePicker, '');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);

expect(datePicker.invalid).to.be.true;
});
Expand Down Expand Up @@ -436,20 +444,23 @@ describe('validation', () => {
setInputValue(datePicker, '1/1/2000');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.true;
});

it('should be valid when committing a value > min', async () => {
setInputValue(datePicker, '1/1/2022');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.false;
});

it('should be valid when committing a value = min', async () => {
setInputValue(datePicker, '1/1/2022');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.false;
});
});
Expand Down Expand Up @@ -486,20 +497,23 @@ describe('validation', () => {
setInputValue(datePicker, '1/1/2022');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.true;
});

it('should be valid when committing a value < max', async () => {
setInputValue(datePicker, '1/1/2000');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.false;
});

it('should be valid when committing a value = max', async () => {
setInputValue(datePicker, '1/1/2010');
await waitForOverlayRender();
enter(input);
await nextUpdate(datePicker);
expect(datePicker.invalid).to.be.false;
});
});
Expand Down

0 comments on commit 201d98c

Please sign in to comment.