ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(select-rich): set dynamically name prop on child option elements

Browse source
This commit is contained in:
Joren Broekema 2019-10-11 11:42:23 +02:00 committed by Thomas Allmer
parent 97265d09dd
commit b9ba3dbe14
2 changed files with 23 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
packages/select-rich/src/LionSelectRich.js
View file

@ -238,7 +238,12 @@ export class LionSelectRich extends OverlayMixin(
* @override
* @param {*} child
*/
addFormElement(child) {
addFormElement(passedChild) {
const child = passedChild;
// Set the name property on the option elements ourselves, for form serialization
child.name = `${this.name}[]`;
super.addFormElement(child);
// we need to adjust the elements being registered
/* eslint-disable no-param-reassign */

17
packages/select-rich/test/lion-select-rich.test.js
View file

@ -25,6 +25,23 @@ describe('lion-select-rich', () => {
expect(el.hasAttribute('tabindex')).to.be.false;
});
it('delegates the name attribute to its children options', async () => {
const el = await fixture(html`
<lion-select-rich name="foo">
<lion-options slot="input">
<lion-option .choiceValue=${10}>Item 1</lion-option>
<lion-option .choiceValue=${20}>Item 2</lion-option>
</lion-options>
</lion-select-rich>
`);
const optOne = el.querySelectorAll('lion-option')[0];
const optTwo = el.querySelectorAll('lion-option')[1];
expect(optOne.name).to.equal('foo[]');
expect(optTwo.name).to.equal('foo[]');
});
describe('Invoker', () => {
it('generates an lion-select-invoker if no invoker is provided', async () => {
const el = await fixture(html`