From 8237b64a3bc48619e8c9e08e4b0fcfb8940e8815 Mon Sep 17 00:00:00 2001 From: Joren Broekema Date: Wed, 23 Oct 2019 17:11:54 +0200 Subject: [PATCH 1/4] fix(overlays): remove setting inheritsReferenceWidth by default --- packages/overlays/src/OverlayController.js | 6 ++++-- packages/overlays/test/local-positioning.test.js | 12 ++++++------ 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/packages/overlays/src/OverlayController.js b/packages/overlays/src/OverlayController.js index e3f2be79d..a72e66259 100644 --- a/packages/overlays/src/OverlayController.js +++ b/packages/overlays/src/OverlayController.js @@ -26,7 +26,7 @@ export class OverlayController { invokerNode: config.invokerNode, referenceNode: null, elementToFocusAfterHide: document.body, - inheritsReferenceWidth: 'min', + inheritsReferenceWidth: '', hasBackdrop: false, isBlocking: false, preventsScroll: false, @@ -498,8 +498,10 @@ export class OverlayController { case 'full': this._contentNodeWrapper.style.width = referenceWidth; break; - default: + case 'min': this._contentNodeWrapper.style.minWidth = referenceWidth; + break; + /* no default */ } } diff --git a/packages/overlays/test/local-positioning.test.js b/packages/overlays/test/local-positioning.test.js index 3f2623b38..fe8ad1d38 100644 --- a/packages/overlays/test/local-positioning.test.js +++ b/packages/overlays/test/local-positioning.test.js @@ -202,14 +202,14 @@ describe('Local Positioning', () => { `); await ctrl.show(); expect(normalizeTransformStyle(ctrl.content.style.transform)).to.equal( - 'translate3d(0px, -28px, 0px)', + 'translate3d(10px, -28px, 0px)', 'Popper positioning values', ); await ctrl.hide(); await ctrl.show(); expect(normalizeTransformStyle(ctrl.content.style.transform)).to.equal( - 'translate3d(0px, -28px, 0px)', + 'translate3d(10px, -28px, 0px)', 'Popper positioning values should be identical after hiding and showing', ); }); @@ -242,7 +242,7 @@ describe('Local Positioning', () => { await ctrl.show(); expect(normalizeTransformStyle(ctrl.content.style.transform)).to.equal( - 'translate3d(0px, -30px, 0px)', + 'translate3d(10px, -30px, 0px)', 'Popper positioning values', ); @@ -258,7 +258,7 @@ describe('Local Positioning', () => { await ctrl.show(); expect(ctrl._popper.options.modifiers.offset.offset).to.equal('0, 20px'); expect(normalizeTransformStyle(ctrl.content.style.transform)).to.equal( - 'translate3d(0px, -40px, 0px)', + 'translate3d(10px, -40px, 0px)', 'Popper positioning Y value should be 10 less than previous, due to the added extra 10px offset', ); }); @@ -292,7 +292,7 @@ describe('Local Positioning', () => { await ctrl.show(); expect(normalizeTransformStyle(ctrl.content.style.transform)).to.equal( - 'translate3d(0px, -30px, 0px)', + 'translate3d(10px, -30px, 0px)', 'Popper positioning values', ); @@ -305,7 +305,7 @@ describe('Local Positioning', () => { }, }); expect(normalizeTransformStyle(ctrl.content.style.transform)).to.equal( - 'translate3d(0px, -40px, 0px)', + 'translate3d(10px, -40px, 0px)', 'Popper positioning Y value should be 10 less than previous, due to the added extra 10px offset', ); }); From 88e75a271feb8249e0c52e3729aa7dc6a7b57604 Mon Sep 17 00:00:00 2001 From: Joren Broekema Date: Fri, 25 Oct 2019 11:35:23 +0200 Subject: [PATCH 2/4] fix(field): teardown registrarmanager listener on field after register Co-authored-by: Anton Kot --- packages/field/src/FormRegisteringMixin.js | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/packages/field/src/FormRegisteringMixin.js b/packages/field/src/FormRegisteringMixin.js index 700cf2a7d..b8277d456 100644 --- a/packages/field/src/FormRegisteringMixin.js +++ b/packages/field/src/FormRegisteringMixin.js @@ -13,6 +13,11 @@ export const FormRegisteringMixin = dedupeMixin( superclass => // eslint-disable-next-line no-shadow, no-unused-vars class FormRegisteringMixin extends superclass { + constructor() { + super(); + this.__boundDispatchRegistration = this._dispatchRegistration.bind(this); + } + connectedCallback() { if (super.connectedCallback) { super.connectedCallback(); @@ -31,9 +36,10 @@ export const FormRegisteringMixin = dedupeMixin( if (formRegistrarManager.ready) { this._dispatchRegistration(); } else { - formRegistrarManager.addEventListener('all-forms-open-for-registration', () => { - this._dispatchRegistration(); - }); + formRegistrarManager.addEventListener( + 'all-forms-open-for-registration', + this.__boundDispatchRegistration, + ); } } @@ -44,6 +50,10 @@ export const FormRegisteringMixin = dedupeMixin( bubbles: true, }), ); + formRegistrarManager.removeEventListener( + 'all-forms-open-for-registration', + this.__boundDispatchRegistration, + ); } _unregisterFormElement() { From d78f60054b2135babe442a30324359d7892a3460 Mon Sep 17 00:00:00 2001 From: Joren Broekema Date: Fri, 25 Oct 2019 10:52:26 +0200 Subject: [PATCH 3/4] fix(textarea): delegate readonly to the native element Co-authored-by: Nithya Lakshmi --- packages/textarea/src/LionTextarea.js | 13 +++++++++++++ packages/textarea/test/lion-textarea.test.js | 10 +++++++++- 2 files changed, 22 insertions(+), 1 deletion(-) diff --git a/packages/textarea/src/LionTextarea.js b/packages/textarea/src/LionTextarea.js index a0857418a..ab9315200 100644 --- a/packages/textarea/src/LionTextarea.js +++ b/packages/textarea/src/LionTextarea.js @@ -19,6 +19,11 @@ export class LionTextarea extends LionField { type: Number, reflect: true, }, + readOnly: { + type: Boolean, + attribute: 'readonly', + reflect: true, + }, }; } @@ -42,6 +47,7 @@ export class LionTextarea extends LionField { super(); this.rows = 2; this.maxRows = 6; + this.readOnly = false; } connectedCallback() { @@ -63,6 +69,13 @@ export class LionTextarea extends LionField { } } + if (changedProperties.has('readOnly')) { + const native = this.inputElement; + if (native) { + native.readOnly = this.readOnly; + } + } + if (changedProperties.has('modelValue')) { this.resizeTextarea(); } diff --git a/packages/textarea/test/lion-textarea.test.js b/packages/textarea/test/lion-textarea.test.js index 76582ed85..4cc716897 100644 --- a/packages/textarea/test/lion-textarea.test.js +++ b/packages/textarea/test/lion-textarea.test.js @@ -22,12 +22,14 @@ describe('', () => { expect(el.maxRows).to.equal(6); }); - it('has .rows=2 and rows="2" by default', async () => { + it('has .readOnly=false .rows=2 and rows="2" by default', async () => { const el = await fixture(`foo`); expect(el.rows).to.equal(2); expect(el.getAttribute('rows')).to.be.equal('2'); expect(el.inputElement.rows).to.equal(2); expect(el.inputElement.getAttribute('rows')).to.be.equal('2'); + expect(el.readOnly).to.be.false; + expect(el.inputElement.hasAttribute('readonly')).to.be.false; }); it('sync rows down to the native textarea', async () => { @@ -38,6 +40,12 @@ describe('', () => { expect(el.inputElement.getAttribute('rows')).to.be.equal('8'); }); + it('sync readOnly to the native textarea', async () => { + const el = await fixture(`foo`); + expect(el.readOnly).to.be.true; + expect(el.querySelector('textarea').readOnly).to.be.true; + }); + it('disables user resize behavior', async () => { if (!hasBrowserResizeSupport()) { return; From d25b2d47db2ca818dadfbd158947ff9c67ff751e Mon Sep 17 00:00:00 2001 From: Joren Broekema Date: Fri, 25 Oct 2019 10:56:02 +0200 Subject: [PATCH 4/4] fix(input): ensure readOnly is reflected to the readonly attribute --- packages/input/src/LionInput.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/input/src/LionInput.js b/packages/input/src/LionInput.js index 1649410dd..3887d55f4 100644 --- a/packages/input/src/LionInput.js +++ b/packages/input/src/LionInput.js @@ -20,6 +20,7 @@ export class LionInput extends LionField { readOnly: { type: Boolean, attribute: 'readonly', + reflect: true, }, type: { type: String,