From 75b3e2c92fd38e075d18a13e2e568062c07f21c7 Mon Sep 17 00:00:00 2001 From: JaySunSyn Date: Tue, 1 Oct 2019 14:59:53 +0200 Subject: [PATCH 1/5] fix(form-registrar-mixin): call becomesReady on connectedCallback --- packages/field/src/FormRegistrarMixin.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/field/src/FormRegistrarMixin.js b/packages/field/src/FormRegistrarMixin.js index e31906d42..c91d03835 100644 --- a/packages/field/src/FormRegistrarMixin.js +++ b/packages/field/src/FormRegistrarMixin.js @@ -38,6 +38,7 @@ export const FormRegistrarMixin = dedupeMixin( super.connectedCallback(); } formRegistrarManager.add(this); + formRegistrarManager.becomesReady(this); } disconnectedCallback() { From 991af25d8716963a5669717dec71fd82443edd2c Mon Sep 17 00:00:00 2001 From: JaySunSyn Date: Thu, 10 Oct 2019 17:22:56 +0200 Subject: [PATCH 2/5] fix(form-registrar-mixin): ensure becomesReady called only once --- packages/field/src/FormRegistrarMixin.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/field/src/FormRegistrarMixin.js b/packages/field/src/FormRegistrarMixin.js index c91d03835..be7b8a200 100644 --- a/packages/field/src/FormRegistrarMixin.js +++ b/packages/field/src/FormRegistrarMixin.js @@ -25,6 +25,7 @@ export const FormRegistrarMixin = dedupeMixin( super(); this.formElements = []; this.__readyForRegistration = false; + this.__hasBeenRenedered = false; this.registrationReady = new Promise(resolve => { this.__resolveRegistrationReady = resolve; }); @@ -38,7 +39,9 @@ export const FormRegistrarMixin = dedupeMixin( super.connectedCallback(); } formRegistrarManager.add(this); - formRegistrarManager.becomesReady(this); + if (this.__hasBeenRenedered) { + formRegistrarManager.becomesReady(this); + } } disconnectedCallback() { @@ -57,6 +60,7 @@ export const FormRegistrarMixin = dedupeMixin( this.__resolveRegistrationReady(); this.__readyForRegistration = true; formRegistrarManager.becomesReady(this); + this.__hasBeenRenedered = true; } addFormElement(child) { From 3196ec4f00f88991f25b65ce391b592026f2f196 Mon Sep 17 00:00:00 2001 From: JaySunSyn Date: Thu, 10 Oct 2019 19:19:27 +0200 Subject: [PATCH 3/5] chore(registra-mixin): start with test --- .../field/test/FormRegistrarMixin.test.js | 71 +++++++++++++++++++ 1 file changed, 71 insertions(+) create mode 100644 packages/field/test/FormRegistrarMixin.test.js diff --git a/packages/field/test/FormRegistrarMixin.test.js b/packages/field/test/FormRegistrarMixin.test.js new file mode 100644 index 000000000..2c1dd62fc --- /dev/null +++ b/packages/field/test/FormRegistrarMixin.test.js @@ -0,0 +1,71 @@ +import { fixture, html, expect } from '@open-wc/testing'; +import { cache, LitElement } from '@lion/core'; +import { LionFieldset } from '../../fieldset/src/LionFieldset.js'; +import { FormRegistrarMixin } from '../src/FormRegistrarMixin.js'; + +describe.only('FormRegistrarMixin', () => { + before(async () => { + const FormRegistrarMixinClass = class extends FormRegistrarMixin(LionFieldset) { + static get properties() { + return { + modelValue: { + type: String, + }, + }; + } + }; + customElements.define('test-registrar', FormRegistrarMixinClass); + + const ContainerClass = class extends LitElement { + static get properties() { + return { + hide: Boolean, + }; + } + + render() { + if (this.hide === true) { + return html``; + } + return html` + ${cache( + html` + + `, + )} + `; + } + }; + customElements.define('test-container', ContainerClass); + }); + + it('has the capability to override the help text', async () => { + const element = await fixture( + html` + + `, + ); + const child = await fixture( + html` + + `, + ); + await element.updateComplete; + const registrar = () => element.shadowRoot.querySelector('test-registrar'); + registrar().addFormElement(child); + + expect(Object.keys(registrar().formElements).length).to.be.equal(1); + + element.hide = true; + await element.updateComplete; + element.hide = false; + await element.updateComplete; + await new Promise(resolve => + setTimeout(() => { + resolve(); + }, 1500), + ); + + expect(Object.keys(registrar().formElements).length).to.be.equal(1); + }); +}); From 2d45e65926ebf875bac74fec48fca1dbd8a4cca7 Mon Sep 17 00:00:00 2001 From: JaySunSyn Date: Sun, 13 Oct 2019 13:15:32 +0200 Subject: [PATCH 4/5] fix(form-registrar-mixin): fix typo --- packages/field/src/FormRegistrarMixin.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/field/src/FormRegistrarMixin.js b/packages/field/src/FormRegistrarMixin.js index be7b8a200..a1e283d76 100644 --- a/packages/field/src/FormRegistrarMixin.js +++ b/packages/field/src/FormRegistrarMixin.js @@ -25,7 +25,7 @@ export const FormRegistrarMixin = dedupeMixin( super(); this.formElements = []; this.__readyForRegistration = false; - this.__hasBeenRenedered = false; + this.__hasBeenRendered = false; this.registrationReady = new Promise(resolve => { this.__resolveRegistrationReady = resolve; }); @@ -39,8 +39,8 @@ export const FormRegistrarMixin = dedupeMixin( super.connectedCallback(); } formRegistrarManager.add(this); - if (this.__hasBeenRenedered) { - formRegistrarManager.becomesReady(this); + if (this.__hasBeenRendered) { + formRegistrarManager.becomesReady(); } } @@ -59,8 +59,8 @@ export const FormRegistrarMixin = dedupeMixin( super.firstUpdated(changedProperties); this.__resolveRegistrationReady(); this.__readyForRegistration = true; - formRegistrarManager.becomesReady(this); - this.__hasBeenRenedered = true; + formRegistrarManager.becomesReady(); + this.__hasBeenRendered = true; } addFormElement(child) { From 1b8f3b0cf81adf60e9a834a0da7914436312f9dc Mon Sep 17 00:00:00 2001 From: JaySunSyn Date: Sun, 13 Oct 2019 13:18:02 +0200 Subject: [PATCH 5/5] chore(form-registrar-mixin-test): revert --- .../field/test/FormRegistrarMixin.test.js | 71 ------------------- 1 file changed, 71 deletions(-) delete mode 100644 packages/field/test/FormRegistrarMixin.test.js diff --git a/packages/field/test/FormRegistrarMixin.test.js b/packages/field/test/FormRegistrarMixin.test.js deleted file mode 100644 index 2c1dd62fc..000000000 --- a/packages/field/test/FormRegistrarMixin.test.js +++ /dev/null @@ -1,71 +0,0 @@ -import { fixture, html, expect } from '@open-wc/testing'; -import { cache, LitElement } from '@lion/core'; -import { LionFieldset } from '../../fieldset/src/LionFieldset.js'; -import { FormRegistrarMixin } from '../src/FormRegistrarMixin.js'; - -describe.only('FormRegistrarMixin', () => { - before(async () => { - const FormRegistrarMixinClass = class extends FormRegistrarMixin(LionFieldset) { - static get properties() { - return { - modelValue: { - type: String, - }, - }; - } - }; - customElements.define('test-registrar', FormRegistrarMixinClass); - - const ContainerClass = class extends LitElement { - static get properties() { - return { - hide: Boolean, - }; - } - - render() { - if (this.hide === true) { - return html``; - } - return html` - ${cache( - html` - - `, - )} - `; - } - }; - customElements.define('test-container', ContainerClass); - }); - - it('has the capability to override the help text', async () => { - const element = await fixture( - html` - - `, - ); - const child = await fixture( - html` - - `, - ); - await element.updateComplete; - const registrar = () => element.shadowRoot.querySelector('test-registrar'); - registrar().addFormElement(child); - - expect(Object.keys(registrar().formElements).length).to.be.equal(1); - - element.hide = true; - await element.updateComplete; - element.hide = false; - await element.updateComplete; - await new Promise(resolve => - setTimeout(() => { - resolve(); - }, 1500), - ); - - expect(Object.keys(registrar().formElements).length).to.be.equal(1); - }); -});