Skip to content
This repository was archived by the owner on Oct 19, 2021. It is now read-only.

Commit 33752d8

Browse files
ritchchrisdhanaraj
authored andcommitted
fix(Search): defaultValue prop support (#57)
* test(Search): fix search input value rendering test - test checks the `defaultValue` instead of the `value` - updating the test to check `value` fails - expected value `"test"` - received value `""` * fix(Search): defaultValue prop support
1 parent 55d46f4 commit 33752d8

File tree

2 files changed

+6
-13
lines changed

2 files changed

+6
-13
lines changed

components/Search.js

Lines changed: 5 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -24,23 +24,14 @@ class Search extends Component {
2424

2525
state = {
2626
format: 'list',
27-
value: '',
28-
hasContent: false,
2927
};
3028

3129
toggleClearIcon = evt => {
32-
const hasContent = evt.target.value.length > 0;
33-
this.setState({
34-
hasContent,
35-
value: evt.target.value,
36-
});
30+
this.input.value = evt.target.value;
3731
};
3832

3933
clearInput = () => {
40-
this.setState({
41-
value: '',
42-
hasContent: false,
43-
});
34+
this.input.value = '';
4435
this.input.focus();
4536
};
4637

@@ -123,9 +114,11 @@ class Search extends Component {
123114
[className]: className,
124115
});
125116

117+
const hasContent = Boolean(this.input) && Boolean(this.input.value);
118+
126119
const clearClasses = classNames({
127120
'bx--search-close': true,
128-
'bx--search-close--hidden': !this.state.hasContent,
121+
'bx--search-close--hidden': hasContent,
129122
});
130123

131124
return (
@@ -142,7 +135,6 @@ class Search extends Component {
142135
className="bx--search-input"
143136
id={id}
144137
placeholder={placeHolderText}
145-
value={this.state.value}
146138
onInput={this.toggleClearIcon}
147139
ref={input => {
148140
this.input = input;

components/__tests__/Search-test.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ describe('Search', () => {
4141
expect(textInput.props().defaultValue).toEqual(undefined);
4242
wrapper.setProps({ defaultValue: 'test' });
4343
expect(textInput.props().defaultValue).toEqual('test');
44+
expect(textInput.props().value).toEqual(undefined);
4445
});
4546

4647
it('should set placeholder as expected', () => {

0 commit comments

Comments
 (0)