From 614be5fb893e2535ad3d6a2926d70938418b119f Mon Sep 17 00:00:00 2001 From: Thijs Louisse Date: Mon, 13 Jan 2020 10:40:45 +0100 Subject: [PATCH] chore: removed circular devdeps fieldset/form --- packages/fieldset/package.json | 3 +- packages/fieldset/test/lion-fieldset.test.js | 32 +++++++--- packages/form/package.json | 6 +- packages/form/test/lion-form.test.js | 65 +++++++++++++------- 4 files changed, 71 insertions(+), 35 deletions(-) diff --git a/packages/fieldset/package.json b/packages/fieldset/package.json index 4e5f0939f..4a8fd6f12 100644 --- a/packages/fieldset/package.json +++ b/packages/fieldset/package.json @@ -37,9 +37,8 @@ "@lion/validate": "0.5.4" }, "devDependencies": { - "@lion/input": "0.4.2", "@lion/localize": "0.7.2", - "@open-wc/demoing-storybook": "^1.1.1", + "@open-wc/demoing-storybook": "^1.6.1", "@open-wc/testing": "^2.3.4", "sinon": "^7.2.2" } diff --git a/packages/fieldset/test/lion-fieldset.test.js b/packages/fieldset/test/lion-fieldset.test.js index a23604288..568c5d569 100644 --- a/packages/fieldset/test/lion-fieldset.test.js +++ b/packages/fieldset/test/lion-fieldset.test.js @@ -1,13 +1,31 @@ -import { expect, fixture, html, unsafeStatic, triggerFocusFor, nextFrame } from '@open-wc/testing'; +import { + expect, + fixture, + html, + unsafeStatic, + triggerFocusFor, + nextFrame, + defineCE, +} from '@open-wc/testing'; import sinon from 'sinon'; import { Validator, IsNumber } from '@lion/validate'; import { localizeTearDown } from '@lion/localize/test-helpers.js'; -import '@lion/input/lion-input.js'; import '../lion-fieldset.js'; +import { LionField } from '@lion/field'; +import '@lion/field/lion-field.js'; + +const childTagString = defineCE( + class extends LionField { + get slots() { + return { + input: () => document.createElement('input'), + }; + } + }, +); const tagString = 'lion-fieldset'; const tag = unsafeStatic(tagString); -const childTagString = 'lion-input'; const childTag = unsafeStatic(childTagString); const inputSlots = html` <${childTag} name="gender[]"> @@ -768,14 +786,14 @@ describe('', () => { }); }); - describe('reset', () => { + describe('Reset', () => { it('restores default values if changes were made', async () => { const el = await fixture(html` <${tag}> <${childTag} id="firstName" name="firstName" .modelValue="${'Foo'}"> `); - await el.querySelector('lion-input').updateComplete; + await el.querySelector(childTagString).updateComplete; const input = el.querySelector('#firstName'); @@ -794,7 +812,7 @@ describe('', () => { <${childTag} id="firstName" name="firstName[]" .modelValue="${'Foo'}"> `); - await el.querySelector('lion-input').updateComplete; + await el.querySelector(childTagString).updateComplete; const input = el.querySelector('#firstName'); @@ -817,7 +835,7 @@ describe('', () => { `); await Promise.all([ el.querySelector('lion-fieldset').updateComplete, - el.querySelector('lion-input').updateComplete, + el.querySelector(childTagString).updateComplete, ]); const input = el.querySelector('#firstName'); diff --git a/packages/form/package.json b/packages/form/package.json index 40691a29c..0e739f26d 100644 --- a/packages/form/package.json +++ b/packages/form/package.json @@ -36,11 +36,9 @@ "@lion/fieldset": "0.5.7" }, "devDependencies": { - "@lion/input": "0.4.2", - "@lion/input-iban": "0.4.2", - "@lion/textarea": "0.4.2", + "@lion/field": "0.7.0", "@lion/validate": "0.5.4", - "@open-wc/demoing-storybook": "^1.1.1", + "@open-wc/demoing-storybook": "^1.6.1", "@open-wc/testing": "^2.3.4", "sinon": "^7.2.2" } diff --git a/packages/form/test/lion-form.test.js b/packages/form/test/lion-form.test.js index b968e1b2c..7d47652eb 100644 --- a/packages/form/test/lion-form.test.js +++ b/packages/form/test/lion-form.test.js @@ -1,19 +1,40 @@ -import { expect, fixture, html, oneEvent, aTimeout } from '@open-wc/testing'; +import { + expect, + fixture, + html, + oneEvent, + aTimeout, + unsafeStatic, + defineCE, +} from '@open-wc/testing'; import { spy } from 'sinon'; - -import '@lion/input/lion-input.js'; +import { LionField } from '@lion/field'; +import '@lion/field/lion-field.js'; import '@lion/fieldset/lion-fieldset.js'; - import '../lion-form.js'; +const childTagString = defineCE( + class extends LionField { + get slots() { + return { + input: () => document.createElement('input'), + }; + } + }, +); +const childTag = unsafeStatic(childTagString); +const formTagString = 'lion-form'; +const formTag = unsafeStatic(formTagString); + describe('', () => { it('has a custom reset that gets triggered by native reset', async () => { const withDefaults = await fixture(html` -
- -
+ <${formTag}> +
+ <${childTag} name="firstName" .modelValue="${'Foo'}"> + +
+ `); const resetButton = withDefaults.querySelector('input[type=reset]'); @@ -41,11 +62,11 @@ describe('', () => { it('dispatches reset events', async () => { const el = await fixture(html` - + <${formTag}>
- + <${childTag} name="firstName" .modelValue="${'Foo'}">
- + `); setTimeout(() => el.reset()); @@ -60,11 +81,11 @@ describe('', () => { it('works with the native submit event (triggered via a button)', async () => { const submitSpy = spy(); const el = await fixture(html` - + <${formTag} @submit=${submitSpy}>
- + `); const button = el.querySelector('button'); @@ -74,11 +95,11 @@ describe('', () => { it('dispatches submit events', async () => { const el = await fixture(html` - + <${formTag}>
- + `); const button = el.querySelector('button'); setTimeout(() => button.click()); @@ -92,11 +113,11 @@ describe('', () => { it('handles internal submit handler before dispatch', async () => { const el = await fixture(html` - + <${formTag}>
- + `); const button = el.querySelector('button'); const internalHandlerSpy = spy(el, 'submitGroup'); @@ -108,11 +129,11 @@ describe('', () => { it('handles internal submit handler before dispatch', async () => { const el = await fixture(html` - + <${formTag}>
- + `); const button = el.querySelector('button'); const internalHandlerSpy = spy(el, 'submitGroup'); @@ -124,11 +145,11 @@ describe('', () => { it('handles internal reset handler before dispatch', async () => { const el = await fixture(html` - + <${formTag}>
- + `); const button = el.querySelector('button'); const internalHandlerSpy = spy(el, 'resetGroup');