fix(field): support moving of a portal node
This commit is contained in:
parent
c49a82fec9
commit
6a57e8a235
2 changed files with 29 additions and 0 deletions
|
|
@ -21,6 +21,7 @@ export const FormRegistrarPortalMixin = dedupeMixin(
|
||||||
super();
|
super();
|
||||||
this.formElements = [];
|
this.formElements = [];
|
||||||
this.registrationTarget = undefined;
|
this.registrationTarget = undefined;
|
||||||
|
this.__hasBeenRendered = false;
|
||||||
this.__readyForRegistration = false;
|
this.__readyForRegistration = false;
|
||||||
this.registrationReady = new Promise(resolve => {
|
this.registrationReady = new Promise(resolve => {
|
||||||
this.__resolveRegistrationReady = resolve;
|
this.__resolveRegistrationReady = resolve;
|
||||||
|
|
@ -34,6 +35,9 @@ export const FormRegistrarPortalMixin = dedupeMixin(
|
||||||
this.__checkRegistrationTarget();
|
this.__checkRegistrationTarget();
|
||||||
|
|
||||||
formRegistrarManager.add(this);
|
formRegistrarManager.add(this);
|
||||||
|
if (this.__hasBeenRendered) {
|
||||||
|
formRegistrarManager.becomesReady();
|
||||||
|
}
|
||||||
|
|
||||||
this.__redispatchEventForFormRegistrarPortalMixin = ev => {
|
this.__redispatchEventForFormRegistrarPortalMixin = ev => {
|
||||||
ev.stopPropagation();
|
ev.stopPropagation();
|
||||||
|
|
@ -67,6 +71,7 @@ export const FormRegistrarPortalMixin = dedupeMixin(
|
||||||
this.__resolveRegistrationReady();
|
this.__resolveRegistrationReady();
|
||||||
this.__readyForRegistration = true;
|
this.__readyForRegistration = true;
|
||||||
formRegistrarManager.becomesReady(this);
|
formRegistrarManager.becomesReady(this);
|
||||||
|
this.__hasBeenRendered = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
__checkRegistrationTarget() {
|
__checkRegistrationTarget() {
|
||||||
|
|
|
||||||
|
|
@ -221,6 +221,30 @@ export const runRegistrationSuite = customConfig => {
|
||||||
expect(registerSpy.args[2][0].target.tagName).to.equal(childEl.tagName);
|
expect(registerSpy.args[2][0].target.tagName).to.equal(childEl.tagName);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('keeps working if moving the portal itself', async () => {
|
||||||
|
const el = await fixture(html`<${parentTag}></${parentTag}>`);
|
||||||
|
const portal = await fixture(html`
|
||||||
|
<${portalTag} .registrationTarget=${el}>
|
||||||
|
<${childTag}></${childTag}>
|
||||||
|
</${portalTag}>
|
||||||
|
`);
|
||||||
|
const otherPlace = await fixture(html`
|
||||||
|
<div></div>
|
||||||
|
`);
|
||||||
|
otherPlace.appendChild(portal);
|
||||||
|
const newField = await fixture(html`
|
||||||
|
<${childTag}></${childTag}>
|
||||||
|
`);
|
||||||
|
|
||||||
|
expect(el.formElements.length).to.equal(1);
|
||||||
|
|
||||||
|
portal.appendChild(newField);
|
||||||
|
expect(el.formElements.length).to.equal(2);
|
||||||
|
|
||||||
|
portal.removeChild(newField);
|
||||||
|
expect(el.formElements.length).to.equal(1);
|
||||||
|
});
|
||||||
|
|
||||||
it('works for portals that have a delayed render', async () => {
|
it('works for portals that have a delayed render', async () => {
|
||||||
const delayedPortalString = defineCE(
|
const delayedPortalString = defineCE(
|
||||||
class extends FormRegistrarPortalMixin(LitElement) {
|
class extends FormRegistrarPortalMixin(LitElement) {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue