Merge pull request #181 from i-like-robots/delimiters-for-soft-keyboards

Delimiters for soft keyboards

Author: i-like-robots

CHANGELOG.md

@@ -13,6 +13,7 @@
 - Refactored event handlers and callbacks to use `on` prefixes
 - Refactored `classNames` option to avoid creating new and merging objects for each top-level props change
 - Refactored `deleteTag` method so it no longer clears the input text when a tag is removed
+- Refactored `delimiters` option to be an array of `KeyboardEvent.key` values
 - Removed `clearInputOnDelete` option
 - Removed `autofocus` option
 - Removed `delimiterChars` option

lib/ReactTags.js

@@ -112,7 +112,16 @@ class ReactTags extends React.Component {
       this.props.onInput(query)
     }
 
-    if (query !== this.state.query) {
+    // NOTE: This test is a last resort for soft keyboards and browsers which do not
+    // support `KeyboardEvent.key`.
+    // <https://bugs.chromium.org/p/chromium/issues/detail?id=763559>
+    // <https://bugs.chromium.org/p/chromium/issues/detail?id=118639>
+    if (
+      query.length === this.state.query.length + 1 &&
+      this.props.delimiters.indexOf(query.slice(-1)) > -1
+    ) {
+      pressDelimiter.call(this)
+    } else if (query !== this.state.query) {
       const options = getOptions.call(this, query)
       this.setState({ query, options })
     }