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](http://michaeldeboey.be)
[π»](https://github.com/paypal/downshift/commits?author=MichaelDeBoey "Code") | [
Henry](https://github.com/EricHenry)
[π»](https://github.com/paypal/downshift/commits?author=EricHenry "Code") | [
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](https://github.com/arthurdenner)
[π»](https://github.com/paypal/downshift/commits?author=arthurdenner "Code") | [
Cody Olsen](http://twitter.com/stipsan)
[π»](https://github.com/paypal/downshift/commits?author=stipsan "Code") | [
Thomas Ladd](https://github.com/TLadd)
[π»](https://github.com/paypal/downshift/commits?author=TLadd "Code") | [
lixualinta](https://github.com/lixualinta)
[π»](https://github.com/paypal/downshift/commits?author=lixualinta "Code") |
| [
Jacob Cofman](https://twitter.com/JCofman)
[π»](https://github.com/paypal/downshift/commits?author=JCofman "Code") | [
Joshua Freedman](https://github.com/jf248)
[π»](https://github.com/paypal/downshift/commits?author=jf248 "Code") | [
Amy](https://github.com/AmyScript)
[π‘](#example-AmyScript "Examples") | [
Rogin Farrer](http://twitter.com/roginfarrer)
[π»](https://github.com/paypal/downshift/commits?author=roginfarrer "Code") | [
Dmitrii Kanatnikov](https://github.com/rifler)
[π»](https://github.com/paypal/downshift/commits?author=rifler "Code") | [
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](https://samuelfullerthomas.com)
[π»](https://github.com/paypal/downshift/commits?author=samuelfullerthomas "Code") |
| [
Ryan Castner](http://audiolion.github.io)
[π»](https://github.com/paypal/downshift/commits?author=audiolion "Code") | [
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](https://github.com/akronb)
[π»](https://github.com/paypal/downshift/commits?author=akronb "Code") [β οΈ](https://github.com/paypal/downshift/commits?author=akronb "Tests") | [
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Γ©](http://manueldugue.de)
[π»](https://github.com/paypal/downshift/commits?author=mdugue "Code") | [
Max Karadeniz](https://github.com/mkaradeniz)
[π»](https://github.com/paypal/downshift/commits?author=mkaradeniz "Code") | [
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](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](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](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](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](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: '',
+ })
},
}