75 lines
2.6 KiB
JavaScript
75 lines
2.6 KiB
JavaScript
/* eslint-disable no-unused-vars, no-param-reassign */
|
|
import { expect, fixture, html } from '@open-wc/testing';
|
|
import sinon from 'sinon';
|
|
import '@lion/form-core/define-validation-feedback';
|
|
import { AlwaysInvalid, AlwaysValid } from '../../test-helpers.js';
|
|
|
|
/**
|
|
* @typedef {import('../../src/validate/LionValidationFeedback').LionValidationFeedback} LionValidationFeedback
|
|
*/
|
|
|
|
describe('lion-validation-feedback', () => {
|
|
it('renders a validation message', async () => {
|
|
const el = /** @type {LionValidationFeedback} */ (await fixture(
|
|
html`<lion-validation-feedback></lion-validation-feedback>`,
|
|
));
|
|
expect(el).shadowDom.to.equal('');
|
|
el.feedbackData = [{ message: 'hello', type: 'error', validator: new AlwaysInvalid() }];
|
|
await el.updateComplete;
|
|
expect(el).shadowDom.to.equal('hello');
|
|
});
|
|
|
|
it('renders the validation type attribute', async () => {
|
|
const el = /** @type {LionValidationFeedback} */ (await fixture(
|
|
html`<lion-validation-feedback></lion-validation-feedback>`,
|
|
));
|
|
el.feedbackData = [{ message: 'hello', type: 'error', validator: new AlwaysInvalid() }];
|
|
await el.updateComplete;
|
|
expect(el.getAttribute('type')).to.equal('error');
|
|
|
|
el.feedbackData = [{ message: 'hello', type: 'warning', validator: new AlwaysInvalid() }];
|
|
await el.updateComplete;
|
|
expect(el.getAttribute('type')).to.equal('warning');
|
|
});
|
|
|
|
it('success message clears after 3s', async () => {
|
|
const el = /** @type {LionValidationFeedback} */ (await fixture(
|
|
html`<lion-validation-feedback></lion-validation-feedback>`,
|
|
));
|
|
|
|
const clock = sinon.useFakeTimers();
|
|
|
|
el.feedbackData = [{ message: 'hello', type: 'success', validator: new AlwaysValid() }];
|
|
await el.updateComplete;
|
|
expect(el.getAttribute('type')).to.equal('success');
|
|
|
|
clock.tick(2900);
|
|
|
|
expect(el.getAttribute('type')).to.equal('success');
|
|
|
|
clock.tick(200);
|
|
|
|
expect(el).to.not.have.attribute('type');
|
|
|
|
clock.restore();
|
|
});
|
|
|
|
it('does not clear error messages', async () => {
|
|
const el = /** @type {LionValidationFeedback} */ (await fixture(
|
|
html`<lion-validation-feedback></lion-validation-feedback>`,
|
|
));
|
|
|
|
const clock = sinon.useFakeTimers();
|
|
|
|
el.feedbackData = [{ message: 'hello', type: 'success', validator: new AlwaysValid() }];
|
|
await el.updateComplete;
|
|
expect(el.getAttribute('type')).to.equal('success');
|
|
|
|
el.feedbackData = [{ message: 'hello', type: 'error', validator: new AlwaysInvalid() }];
|
|
await el.updateComplete;
|
|
clock.tick(3100);
|
|
expect(el.getAttribute('type')).to.equal('error');
|
|
|
|
clock.restore();
|
|
});
|
|
});
|