diff --git a/src/asInput/asInput.test.jsx b/src/asInput/asInput.test.jsx index ab035c8f00..62618aa4da 100644 --- a/src/asInput/asInput.test.jsx +++ b/src/asInput/asInput.test.jsx @@ -41,7 +41,7 @@ describe('asInput()', () => { const wrapper = mount(); expect(wrapper.find('label').text()).toEqual(props.label); expect(wrapper.find('#description-asInput1').text()).toEqual(props.description); - expect(wrapper.state('value')).toEqual(props.value); + expect(wrapper.prop('value')).toEqual(props.value); }); it('creates generic prop id', () => { @@ -81,6 +81,21 @@ describe('asInput()', () => { expect(wrapper.find('small').prop('id')).toEqual(`description-${testId}`); }); + it('overrides state value when props value changes', () => { + const initValue = 'foofoo'; + const newValue = 'barbar'; + const props = { + ...baseProps, + value: initValue, + }; + const wrapper = mount(); + expect(wrapper.state('value')).toEqual(initValue); + wrapper.setProps({ + value: newValue, + }); + expect(wrapper.state('value')).toEqual(newValue); + }); + describe('fires', () => { it('blur handler', () => { const spy = jest.fn(); @@ -149,7 +164,7 @@ describe('asInput()', () => { const err = wrapper.find('.form-control-feedback'); expect(err.exists()).toEqual(true); expect(err.text()).toEqual(validationResult.validationMessage); - // expect(err.hasClass('invalid-feedback')).toEqual(true); + expect(err.hasClass('invalid-feedback')).toEqual(true); const dangerIcon = wrapper.find('.fa-exclamation-circle'); expect(dangerIcon.exists()).toEqual(true); diff --git a/src/asInput/index.jsx b/src/asInput/index.jsx index 3a3c6f4a27..21c41b7dec 100644 --- a/src/asInput/index.jsx +++ b/src/asInput/index.jsx @@ -46,6 +46,14 @@ const asInput = (WrappedComponent, labelFirst = true) => { }; } + componentWillReceiveProps(nextProps) { + if (nextProps.value !== this.props.value) { + this.setState({ + value: nextProps.value, + }); + } + } + getDescriptions() { // possible future work: multiple feedback msgs? const errorId = `error-${this.state.id}`;