diff --git a/src/Select.jsx b/src/Select.jsx index ef2d4b69c..801d3a40e 100644 --- a/src/Select.jsx +++ b/src/Select.jsx @@ -121,7 +121,7 @@ const Select = React.createClass({ value = this.addTitleToValue(props, value); let inputValue = ''; if (props.combobox) { - inputValue = value.length ? String(value[0].key) : ''; + inputValue = value.length ? this.getLabelFromProps(props, value[0].key) : ''; } this.saveInputRef = saveRef.bind(this, 'inputInstance'); this.saveInputMirrorRef = saveRef.bind(this, 'inputMirrorInstance'); diff --git a/tests/Select.combobox.spec.js b/tests/Select.combobox.spec.js index c20e99c42..328f310f6 100644 --- a/tests/Select.combobox.spec.js +++ b/tests/Select.combobox.spec.js @@ -27,23 +27,6 @@ describe('Select.combobox', () => { expect(wrapper.state().inputValue).toBe('1'); }); - it('display correct label when value changes', () => { - const wrapper = mount( - - ); - - wrapper.setProps({ value: { label: 'One', key: '1' } }); - expect(wrapper.find('input').props().value).toBe('One'); - }); - it('fire change event immediately when user inputing', () => { const handleChange = jest.fn(); const wrapper = mount( @@ -72,4 +55,60 @@ describe('Select.combobox', () => { dropdownWrapper.find('MenuItem').first().simulate('click'); expect(wrapper.state().inputValue).toBe('1'); }); + + describe('input value', () => { + const createSelect = (props) => mount( + + ); + + describe('labelInValue is false', () => { + it('displays correct input value for defaultValue', () => { + const wrapper = createSelect({ + defaultValue: '1', + }); + expect(wrapper.find('input').props().value).toBe('One'); + }); + + it('displays correct input value for value', () => { + const wrapper = createSelect({ + value: '1', + }); + expect(wrapper.find('input').props().value).toBe('One'); + }); + }); + + describe('labelInValue is true', () => { + it('displays correct input value for defaultValue', () => { + const wrapper = createSelect({ + labelInValue: true, + defaultValue: { key: '1', label: 'One' }, + }); + expect(wrapper.find('input').props().value).toBe('One'); + }); + + it('displays correct input value for value', () => { + const wrapper = createSelect({ + labelInValue: true, + value: { key: '1', label: 'One' }, + }); + expect(wrapper.find('input').props().value).toBe('One'); + }); + + it('displays correct input value when value changes', () => { + const wrapper = createSelect({ + labelInValue: true, + value: { key: '' }, + }); + wrapper.setProps({ value: { key: '1', label: 'One' } }); + expect(wrapper.find('input').props().value).toBe('One'); + }); + }); + }); });