From 7dc7a5b4a06c640f0c375878b78b82b65119f89b Mon Sep 17 00:00:00 2001 From: Karen Gasparyan Date: Wed, 24 Apr 2019 20:27:17 +0400 Subject: [PATCH] fix: clear input text and selected item on escape key (#689) --- .all-contributorsrc | 9 ++++ .size-snapshot.json | 56 +++++++++++----------- README.md | 10 ++-- src/__tests__/downshift.get-input-props.js | 9 ++-- src/downshift.js | 6 ++- 5 files changed, 52 insertions(+), 38 deletions(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index 0d40ccdad..e6b29110c 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -1054,6 +1054,15 @@ "code", "bug" ] + }, + { + "login": "gaskar", + "name": "Karen Gasparyan", + "avatar_url": "https://avatars1.githubusercontent.com/u/491166?v=4", + "profile": "https://github.com/gaskar", + "contributions": [ + "code" + ] } ] } diff --git a/.size-snapshot.json b/.size-snapshot.json index 05669731b..8a78161d5 100644 --- a/.size-snapshot.json +++ b/.size-snapshot.json @@ -1,59 +1,59 @@ { "dist/downshift.cjs.js": { - "bundled": 55424, - "minified": 24572, - "gzipped": 6727 + "bundled": 55478, + "minified": 24602, + "gzipped": 6733 }, "preact/dist/downshift.cjs.js": { - "bundled": 53993, - "minified": 23422, - "gzipped": 6529 + "bundled": 54047, + "minified": 23452, + "gzipped": 6536 }, "preact/dist/downshift.umd.min.js": { - "bundled": 66597, - "minified": 22781, - "gzipped": 7232 + "bundled": 66654, + "minified": 22813, + "gzipped": 7237 }, "preact/dist/downshift.umd.js": { - "bundled": 79370, - "minified": 28040, - "gzipped": 8593 + "bundled": 79425, + "minified": 28070, + "gzipped": 8598 }, "dist/downshift.umd.min.js": { - "bundled": 71478, - "minified": 24075, - "gzipped": 7803 + "bundled": 71535, + "minified": 24107, + "gzipped": 7808 }, "dist/downshift.umd.js": { - "bundled": 108769, - "minified": 37045, - "gzipped": 11357 + "bundled": 108824, + "minified": 37075, + "gzipped": 11362 }, "dist/downshift.esm.js": { - "bundled": 55050, - "minified": 24281, - "gzipped": 6655, + "bundled": 55104, + "minified": 24311, + "gzipped": 6661, "treeshaked": { "rollup": { - "code": 17130, + "code": 17162, "import_statements": 354 }, "webpack": { - "code": 18427 + "code": 18459 } } }, "preact/dist/downshift.esm.js": { - "bundled": 53639, - "minified": 23146, - "gzipped": 6459, + "bundled": 53693, + "minified": 23176, + "gzipped": 6466, "treeshaked": { "rollup": { - "code": 17120, + "code": 17152, "import_statements": 336 }, "webpack": { - "code": 18382 + "code": 18414 } } } diff --git a/README.md b/README.md index 70618195a..41319a75f 100644 --- a/README.md +++ b/README.md @@ -19,7 +19,7 @@ autocomplete/dropdown/select/combobox components

[![downloads][downloads-badge]][npmcharts] [![version][version-badge]][package] [![MIT License][license-badge]][license] -[![All Contributors](https://img.shields.io/badge/all_contributors-107-orange.svg?style=flat-square)](#contributors) +[![All Contributors](https://img.shields.io/badge/all_contributors-108-orange.svg?style=flat-square)](#contributors) [![PRs Welcome][prs-badge]][prs] [![Chat][chat-badge]][chat] [![Code of Conduct][coc-badge]][coc] [![Join the community on Spectrum][spectrum-badge]][spectrum] @@ -878,9 +878,9 @@ described below. (though if the menu is closed the form submission will work normally). See below for customizing the handlers. -- `Escape`: will reset downshift's state. This means that `highlightedIndex` will be - set to the `defaultHighlightedIndex`, the `inputValue` will be set to the `itemToString` - value of the `selectedItem`, and the `isOpen` state will be set to the `defaultIsOpen`. +- `Escape`: will clear downshift's state. This means that `highlightedIndex` will be + set to the `defaultHighlightedIndex`, the `inputValue` will be set to empty string, + `selectedItem` will be set to `null`, and the `isOpen` state will be set to the `defaultIsOpen`. ### customizing handlers @@ -1125,7 +1125,7 @@ Thanks goes to these people ([emoji key][emojis]): | [MichaΓ«l De Boey
MichaΓ«l De Boey](http://michaeldeboey.be)
[πŸ’»](https://github.com/paypal/downshift/commits?author=MichaelDeBoey "Code") | [Henry
Henry](https://github.com/EricHenry)
[πŸ’»](https://github.com/paypal/downshift/commits?author=EricHenry "Code") | [Andrew Walton
Andrew Walton](http://www.greenarrow.me)
[πŸ›](https://github.com/paypal/downshift/issues?q=author%3Agreen-arrow "Bug reports") [πŸ’»](https://github.com/paypal/downshift/commits?author=green-arrow "Code") [⚠️](https://github.com/paypal/downshift/commits?author=green-arrow "Tests") | [Arthur Denner
Arthur Denner](https://github.com/arthurdenner)
[πŸ’»](https://github.com/paypal/downshift/commits?author=arthurdenner "Code") | [Cody Olsen
Cody Olsen](http://twitter.com/stipsan)
[πŸ’»](https://github.com/paypal/downshift/commits?author=stipsan "Code") | [Thomas Ladd
Thomas Ladd](https://github.com/TLadd)
[πŸ’»](https://github.com/paypal/downshift/commits?author=TLadd "Code") | [lixualinta
lixualinta](https://github.com/lixualinta)
[πŸ’»](https://github.com/paypal/downshift/commits?author=lixualinta "Code") | | [Jacob Cofman
Jacob Cofman](https://twitter.com/JCofman)
[πŸ’»](https://github.com/paypal/downshift/commits?author=JCofman "Code") | [Joshua Freedman
Joshua Freedman](https://github.com/jf248)
[πŸ’»](https://github.com/paypal/downshift/commits?author=jf248 "Code") | [Amy
Amy](https://github.com/AmyScript)
[πŸ’‘](#example-AmyScript "Examples") | [Rogin Farrer
Rogin Farrer](http://twitter.com/roginfarrer)
[πŸ’»](https://github.com/paypal/downshift/commits?author=roginfarrer "Code") | [Dmitrii Kanatnikov
Dmitrii Kanatnikov](https://github.com/rifler)
[πŸ’»](https://github.com/paypal/downshift/commits?author=rifler "Code") | [Dallon Feldner
Dallon Feldner](https://github.com/dallonf)
[πŸ›](https://github.com/paypal/downshift/issues?q=author%3Adallonf "Bug reports") [πŸ’»](https://github.com/paypal/downshift/commits?author=dallonf "Code") | [Samuel Fuller Thomas
Samuel Fuller Thomas](https://samuelfullerthomas.com)
[πŸ’»](https://github.com/paypal/downshift/commits?author=samuelfullerthomas "Code") | | [Ryan Castner
Ryan Castner](http://audiolion.github.io)
[πŸ’»](https://github.com/paypal/downshift/commits?author=audiolion "Code") | [Silviu Alexandru Avram
Silviu Alexandru Avram](https://github.com/silviuavram)
[πŸ›](https://github.com/paypal/downshift/issues?q=author%3Asilviuavram "Bug reports") [πŸ’»](https://github.com/paypal/downshift/commits?author=silviuavram "Code") [⚠️](https://github.com/paypal/downshift/commits?author=silviuavram "Tests") | [Anton Volkov
Anton Volkov](https://github.com/akronb)
[πŸ’»](https://github.com/paypal/downshift/commits?author=akronb "Code") [⚠️](https://github.com/paypal/downshift/commits?author=akronb "Tests") | [Keegan Street
Keegan Street](http://keegan.st)
[πŸ›](https://github.com/paypal/downshift/issues?q=author%3Akeeganstreet "Bug reports") [πŸ’»](https://github.com/paypal/downshift/commits?author=keeganstreet "Code") | [Manuel DuguΓ©
Manuel DuguΓ©](http://manueldugue.de)
[πŸ’»](https://github.com/paypal/downshift/commits?author=mdugue "Code") | [Max Karadeniz
Max Karadeniz](https://github.com/mkaradeniz)
[πŸ’»](https://github.com/paypal/downshift/commits?author=mkaradeniz "Code") | [Gonzalo Beviglia
Gonzalo Beviglia](https://medium.com/@gonchub)
[πŸ›](https://github.com/paypal/downshift/issues?q=author%3AGonchuB "Bug reports") [πŸ’»](https://github.com/paypal/downshift/commits?author=GonchuB "Code") [πŸ‘€](#review-GonchuB "Reviewed Pull Requests") | -| [Brian Kilrain
Brian Kilrain](https://github.com/kilrain)
[πŸ›](https://github.com/paypal/downshift/issues?q=author%3Akilrain "Bug reports") [πŸ’»](https://github.com/paypal/downshift/commits?author=kilrain "Code") [⚠️](https://github.com/paypal/downshift/commits?author=kilrain "Tests") [πŸ“–](https://github.com/paypal/downshift/commits?author=kilrain "Documentation") | [Gerd Zschaler
Gerd Zschaler](http://www.gzschaler.de)
[πŸ’»](https://github.com/paypal/downshift/commits?author=rincedd "Code") [πŸ›](https://github.com/paypal/downshift/issues?q=author%3Arincedd "Bug reports") | +| [Brian Kilrain
Brian Kilrain](https://github.com/kilrain)
[πŸ›](https://github.com/paypal/downshift/issues?q=author%3Akilrain "Bug reports") [πŸ’»](https://github.com/paypal/downshift/commits?author=kilrain "Code") [⚠️](https://github.com/paypal/downshift/commits?author=kilrain "Tests") [πŸ“–](https://github.com/paypal/downshift/commits?author=kilrain "Documentation") | [Gerd Zschaler
Gerd Zschaler](http://www.gzschaler.de)
[πŸ’»](https://github.com/paypal/downshift/commits?author=rincedd "Code") [πŸ›](https://github.com/paypal/downshift/issues?q=author%3Arincedd "Bug reports") | [Karen Gasparyan
Karen Gasparyan](https://github.com/gaskar)
[πŸ’»](https://github.com/paypal/downshift/commits?author=gaskar "Code") | diff --git a/src/__tests__/downshift.get-input-props.js b/src/__tests__/downshift.get-input-props.js index 0ee9dc16f..8f17963c2 100644 --- a/src/__tests__/downshift.get-input-props.js +++ b/src/__tests__/downshift.get-input-props.js @@ -420,19 +420,20 @@ test('escape on an input without a selection should reset downshift and close th expect(childrenSpy).toHaveBeenLastCalledWith( expect.objectContaining({ isOpen: false, + selectedItem: null, inputValue: '', }), ) }) -test('escape on an input with a selection should reset downshift and close the menu', () => { - const {escapeOnInput, childrenSpy, items} = setupDownshiftWithState() +test('escape on an input with a selection should reset downshift, clear input and close the menu', () => { + const {escapeOnInput, childrenSpy} = setupDownshiftWithState() escapeOnInput() expect(childrenSpy).toHaveBeenLastCalledWith( expect.objectContaining({ isOpen: false, - inputValue: items[0], - selectedItem: items[0], + inputValue: '', + selectedItem: null, }), ) }) diff --git a/src/downshift.js b/src/downshift.js index 57ab4e231..8656939a0 100644 --- a/src/downshift.js +++ b/src/downshift.js @@ -610,7 +610,11 @@ class Downshift extends Component { Escape(event) { event.preventDefault() - this.reset({type: stateChangeTypes.keyDownEscape}) + this.reset({ + type: stateChangeTypes.keyDownEscape, + selectedItem: null, + inputValue: '', + }) }, }