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

Merge pull request #376 from SwyserDev/fix/inputPlaceholder

Browse source 
fix: added placeholder attribute for input
This commit is contained in:
Joren Broekema 2019-11-12 12:32:10 -08:00 committed by GitHub
commit a581a4e467
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
packages/input/src/LionInput.js
View file

@ -30,6 +30,10 @@ export class LionInput extends LionField {
type: Number, type: Number,
reflect: true, reflect: true,
}, },
placeholder: {
type: String,
reflect: true,
},
}; };
} }
@ -80,6 +84,9 @@ export class LionInput extends LionField {
if (changedProps.has('step')) { if (changedProps.has('step')) {
this.inputElement.step = this.step; this.inputElement.step = this.step;
} }
if (changedProps.has('placeholder')) {
this.inputElement.placeholder = this.placeholder;
}
} }
__delegateReadOnly() { __delegateReadOnly() {

11
packages/input/test/lion-input.test.js
View file

@ -38,4 +38,15 @@ describe('<lion-input>', () => {
expect(el.getAttribute('type')).to.equal('foo'); expect(el.getAttribute('type')).to.equal('foo');
expect(el.inputElement.getAttribute('type')).to.equal('foo'); expect(el.inputElement.getAttribute('type')).to.equal('foo');
}); });
it('has an attribute that can be used to set the placeholder text of the input', async () => {
const el = await fixture(`<lion-input placeholder="text"></lion-input>`);
expect(el.getAttribute('placeholder')).to.equal('text');
expect(el.inputElement.getAttribute('placeholder')).to.equal('text');
el.placeholder = 'foo';
await el.updateComplete;
expect(el.getAttribute('placeholder')).to.equal('foo');
expect(el.inputElement.getAttribute('placeholder')).to.equal('foo');
});
}); });