fix(form-core): allow popultion conditionally rendered fields
This commit is contained in:
parent
aade6b9424
commit
c347fce4f6
3 changed files with 40 additions and 1 deletions
10
.changeset/big-bags-provide.md
Normal file
10
.changeset/big-bags-provide.md
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
---
|
||||||
|
'@lion/fieldset': patch
|
||||||
|
'@lion/form-core': patch
|
||||||
|
---
|
||||||
|
|
||||||
|
Field population fix
|
||||||
|
|
||||||
|
#### Bugfixes
|
||||||
|
|
||||||
|
- allow population conditionally rendered fields in formGroup/fieldset/form
|
||||||
|
|
@ -342,6 +342,33 @@ describe('<lion-fieldset>', () => {
|
||||||
expect(el.modelValue).to.eql({ lastName: 'Bar' });
|
expect(el.modelValue).to.eql({ lastName: 'Bar' });
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('does not fail when conditional (not rendered) formElements are populated', async () => {
|
||||||
|
const showC = false;
|
||||||
|
const el = await fixture(html`
|
||||||
|
<${tag}>
|
||||||
|
<label slot="label">My Label</label>
|
||||||
|
<${childTag} name="a"></${childTag}>
|
||||||
|
<${childTag} name="b"></${childTag}>
|
||||||
|
${showC ? html`<${childTag} name="c"></${childTag}>` : ''}
|
||||||
|
</${tag}>
|
||||||
|
`);
|
||||||
|
expect(el.formElements.a).to.be.not.undefined;
|
||||||
|
expect(el.formElements.b).to.be.not.undefined;
|
||||||
|
expect(el.formElements.c).to.be.undefined;
|
||||||
|
|
||||||
|
let wasSuccessful = false;
|
||||||
|
try {
|
||||||
|
// c does not exist, because it is not render
|
||||||
|
el.serializedValue = { a: 'x', b: 'y', c: 'z' };
|
||||||
|
wasSuccessful = true;
|
||||||
|
// eslint-disable-next-line no-empty
|
||||||
|
} catch (_) {}
|
||||||
|
|
||||||
|
expect(wasSuccessful).to.be.true;
|
||||||
|
expect(el.formElements.a.serializedValue).to.equal('x');
|
||||||
|
expect(el.formElements.b.serializedValue).to.equal('y');
|
||||||
|
});
|
||||||
|
|
||||||
describe('Validation', () => {
|
describe('Validation', () => {
|
||||||
it('validates on init', async () => {
|
it('validates on init', async () => {
|
||||||
class IsCat extends Validator {
|
class IsCat extends Validator {
|
||||||
|
|
|
||||||
|
|
@ -332,7 +332,9 @@ export const FormGroupMixin = dedupeMixin(
|
||||||
el[property] = values[name][index]; // eslint-disable-line no-param-reassign
|
el[property] = values[name][index]; // eslint-disable-line no-param-reassign
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
if (this.formElements[name]) {
|
||||||
this.formElements[name][property] = values[name];
|
this.formElements[name][property] = values[name];
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue