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

chore(form-integrations): test all registrations

Browse source
This commit is contained in:
Thijs Louisse 2021-04-07 17:25:00 +02:00
parent 5633d2aba8
commit 0fa222c21b
3 changed files with 157 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
packages/form-integrations/test/dialog-integrations.js
View file

@ -1,20 +0,0 @@
import { expect, fixture, html } from '@open-wc/testing';
import './helpers/umbrella-form.js';
import '@lion/dialog/lion-dialog.js';
/**
* @typedef {import('./helpers/umbrella-form.js').UmbrellaForm} UmbrellaForm
* @typedef {import('@lion/dialog/').LionDialog} LionDialog
*/
// Test umbrella form inside dialog
describe('Form inside dialog Integrations', () => {
it('"Successfully spawns all form components inside a dialog', async () => {
expect(
await fixture(html` <lion-dialog>
<button slot="invoker">Open Dialog</button>
<umbrella-form slot="content"></umbrella-form>
</lion-dialog>`),
).to.not.throw();
});
});

86
packages/form-integrations/test/dialog-integrations.test.js Normal file
View file

@ -0,0 +1,86 @@
import { expect, fixture, html } from '@open-wc/testing';
import './helpers/umbrella-form.js';
import '@lion/dialog/define';
/**
* @typedef {import('./helpers/umbrella-form.js').UmbrellaForm} UmbrellaForm
* @typedef {import('@lion/dialog').LionDialog} LionDialog
* @typedef {import('@lion/form').LionForm} LionForm
*/
// Test umbrella form inside dialog
describe('Form inside dialog Integrations', () => {
it('"Successfully registers all form components inside a dialog', async () => {
const el = /** @type {LionDialog} */ await fixture(html` <lion-dialog>
<button slot="invoker">Open Dialog</button>
<umbrella-form slot="content"></umbrella-form>
</lion-dialog>`);
// @ts-ignore
const formEl = /** @type {LionForm} */ (el._overlayCtrl.contentNode._lionFormNode);
const getTagNames = (/** @type {HTMLElement} */ elm) => [
elm.tagName.toLowerCase(),
// @ts-ignore
...(elm.formElements ? elm.formElements.map(getTagNames).flat() : []),
];
// @ts-ignore
const registeredEls = formEl.formElements.map(getTagNames).flat();
// TODO: fix registration of lion-switch and lion-input-stepper
expect(registeredEls).to.eql([
'lion-fieldset',
'lion-input',
'lion-input',
'lion-input-date',
'lion-input-datepicker',
'lion-textarea',
'lion-input-amount',
'lion-input-iban',
'lion-input-email',
'lion-checkbox-group',
'lion-checkbox',
'lion-checkbox',
'lion-checkbox',
'lion-radio-group',
'lion-radio',
'lion-radio',
'lion-radio',
'lion-listbox',
'lion-option',
'lion-option',
'lion-option',
'lion-combobox',
'lion-option',
'lion-option',
'lion-option',
'lion-option',
'lion-option',
'lion-option',
'lion-select-rich',
'lion-option',
'lion-option',
'lion-option',
'lion-select',
'lion-input-range',
'lion-checkbox-group',
'lion-checkbox',
// 'lion-switch',
// 'lion-input-stepper',
'lion-textarea',
]);
});
});

71
packages/form-integrations/test/form-integrations.test.js
View file

@ -85,4 +85,75 @@ describe('Form Integrations', () => {
expect(el._lionFormNode.dirty).to.be.false;
});
});
it('"Successfully registers all form components', async () => {
const el = /** @type {UmbrellaForm} */ await fixture(html`<umbrella-form></umbrella-form>`);
// @ts-ignore
const formEl = /** @type {LionForm} */ (el._lionFormNode);
const getTagNames = (/** @type {HTMLElement} */ elm) => [
elm.tagName.toLowerCase(),
// @ts-ignore
...(elm.formElements ? elm.formElements.map(getTagNames).flat() : []),
];
// @ts-ignore
const registeredEls = formEl.formElements.map(getTagNames).flat();
// TODO: fix registration of lion-switch and lion-input-stepper
expect(registeredEls).to.eql([
'lion-fieldset',
'lion-input',
'lion-input',
'lion-input-date',
'lion-input-datepicker',
'lion-textarea',
'lion-input-amount',
'lion-input-iban',
'lion-input-email',
'lion-checkbox-group',
'lion-checkbox',
'lion-checkbox',
'lion-checkbox',
'lion-radio-group',
'lion-radio',
'lion-radio',
'lion-radio',
'lion-listbox',
'lion-option',
'lion-option',
'lion-option',
'lion-combobox',
'lion-option',
'lion-option',
'lion-option',
'lion-option',
'lion-option',
'lion-option',
'lion-select-rich',
'lion-option',
'lion-option',
'lion-option',
'lion-select',
'lion-input-range',
'lion-checkbox-group',
'lion-checkbox',
// 'lion-switch',
// 'lion-input-stepper',
'lion-textarea',
]);
});
});