Skip to content
This repository has been archived by the owner on Dec 30, 2022. It is now read-only.

fix(SearchBox): avoid to bind click on reset button #979

Merged
merged 1 commit into from
Feb 16, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 1 addition & 6 deletions packages/react-instantsearch/src/components/SearchBox.js
Original file line number Diff line number Diff line change
Expand Up @@ -291,12 +291,7 @@ class SearchBox extends Component {
>
{submitComponent}
</button>
<button
type="reset"
title={translate('resetTitle')}
{...cx('reset')}
onClick={this.onReset}
>
<button type="reset" title={translate('resetTitle')} {...cx('reset')}>
{resetComponent}
</button>
</div>
Expand Down
8 changes: 4 additions & 4 deletions packages/react-instantsearch/src/components/SearchBox.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -252,7 +252,7 @@ describe('SearchBox', () => {
instanceWithLoadingIndicator.unmount();
});

it('expect to clear the query when the reset button is click with searchAsYouType=true', () => {
it('expect to clear the query when the form is reset with searchAsYouType=true', () => {
const refine = jest.fn();

const wrapper = shallow(
Expand All @@ -262,13 +262,13 @@ describe('SearchBox', () => {
// Simulate the ref
wrapper.instance().input = { focus: jest.fn() };

wrapper.find('button[type="reset"]').simulate('click');
wrapper.find('form').simulate('reset');

expect(refine).toHaveBeenCalledWith('');
expect(wrapper.instance().input.focus).toHaveBeenCalled();
});

it('expect to clear the query when the reset button is click with searchAsYouType=false', () => {
it('expect to clear the query when the form is reset with searchAsYouType=false', () => {
const refine = jest.fn();

const wrapper = shallow(
Expand All @@ -281,7 +281,7 @@ describe('SearchBox', () => {
// Simulate change event
wrapper.setState({ query: 'Hello' });

wrapper.find('button[type="reset"]').simulate('click');
wrapper.find('form').simulate('reset');

expect(refine).toHaveBeenCalledWith('');
expect(wrapper.instance().input.focus).toHaveBeenCalled();
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,6 @@ exports[`Menu Menu with search inside items but no search results 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -247,7 +246,6 @@ exports[`Menu Menu with search inside items with search results 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -370,7 +368,6 @@ exports[`Menu applies translations 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,6 @@ exports[`RefinementList applies translations 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -337,7 +336,6 @@ exports[`RefinementList refinement list with search inside items but no search r
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -521,7 +519,6 @@ exports[`RefinementList refinement list with search inside items with search res
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,6 @@ exports[`SearchBox applies its default props 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -166,7 +165,6 @@ exports[`SearchBox lets you customize its theme 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -258,7 +256,6 @@ exports[`SearchBox lets you customize its translations 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="RESET_TITLE"
type="reset"
>
Expand Down Expand Up @@ -344,7 +341,6 @@ exports[`SearchBox lets you give custom components for reset and submit 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -475,7 +471,6 @@ exports[`SearchBox should render the loader if showLoadingIndicator is true 1`]
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -608,7 +603,6 @@ exports[`SearchBox should render the loader if showLoadingIndicator is true 2`]
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -700,7 +694,6 @@ exports[`SearchBox transfers the autoFocus prop to the underlying input element
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -792,7 +785,6 @@ exports[`SearchBox treats its query prop as its input value 1`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down Expand Up @@ -884,7 +876,6 @@ exports[`SearchBox treats its query prop as its input value 2`] = `
</button>
<button
className="ais-SearchBox__reset"
onClick={[Function]}
title="Clear the search query."
type="reset"
>
Expand Down