diff --git a/addon/components/paper-input.js b/addon/components/paper-input.js index 3c45dbbbf..ecd94e97a 100644 --- a/addon/components/paper-input.js +++ b/addon/components/paper-input.js @@ -33,7 +33,8 @@ export default Component.extend(FocusableMixin, ColorMixin, ChildMixin, Validati 'hasLeftIcon:md-icon-left', 'hasRightIcon:md-icon-right', 'focused:md-input-focused', - 'block:md-block' + 'block:md-block', + 'placeholder:md-input-has-placeholder' ], type: 'text', autofocus: false, diff --git a/tests/integration/components/paper-input-test.js b/tests/integration/components/paper-input-test.js index 290120d3a..86dcfb958 100644 --- a/tests/integration/components/paper-input-test.js +++ b/tests/integration/components/paper-input-test.js @@ -74,11 +74,12 @@ module('Integration | Component | paper-input', function(hooks) { }); test('renders input with placeholder', async function(assert) { - assert.expect(1); + assert.expect(2); await render(hbs`{{paper-input placeholder="Enter value here" onChange=dummyOnChange}}`); assert.dom('md-input-container input').hasAttribute('placeholder', 'Enter value here'); + assert.dom('md-input-container').hasClass('md-input-has-placeholder'); }); @@ -517,6 +518,24 @@ module('Integration | Component | paper-input', function(hooks) { assert.dom('.other-stuff').exists(); }); + test('does not have md-input-has-placeholder class when no placeholder', async function(assert) { + assert.expect(1); + + await render(hbs`{{paper-input onChange=dummyOnChange}}`); + + assert.dom('md-input-container').doesNotHaveClass('md-input-has-placeholder'); + + }); + + test('does not have md-input-has-placeholder class when there is a label', async function(assert) { + assert.expect(1); + + await render(hbs`{{paper-input label="Label here" onChange=dummyOnChange}}`); + + assert.dom('md-input-container').doesNotHaveClass('md-input-has-placeholder'); + + }); + test('aria-describedby on input elements is set properly', async function(assert) { let errors = [{