react-tagsinput icon indicating copy to clipboard operation
react-tagsinput copied to clipboard

Android Chrome does not respect delimiter keys

Open Mike-Sinistralis opened this issue 7 years ago • 4 comments

Chrome 59.0.3071.125 Android 7.1.2; Nexus 6P Build/N2G47O

Android Chrome does not trigger any of the delimiter logic when entering the values (for example, physically hitting the comma key). This seems to be a known issue with Android and the suggested work around for it is to use keydown/keyup but I havn't had a chance to verify if this solves the problem.

Mike-Sinistralis avatar Jul 26 '17 14:07 Mike-Sinistralis

I'm having this issue, but the funny thing is that the demo page is properly working from Android.

What's the difference?

acelaya avatar Aug 12 '18 16:08 acelaya

It's 2019 and this issue is still postponed.

ducdev avatar Jul 02 '19 15:07 ducdev

I found a decent explanation of the problem in another library (which also has this issue), react-tags: https://github.com/i-like-robots/react-tags/issues/94

Extracting from there and the links within, here's how I understand the situation:

  • KeyboardEvent.key always (?) returns undefined on Android. Chrome bug, marked as won't fix.
  • We can't fallback to KeyboardEvent.keyCode because it's always 0/229 for most characters. Chrome bug, marked as won't fix.
  • One of the default "add keys"—enter—doesn't suffer from this problem. Presumably this is because, in this case at least, KeyboardEvent.keyCode does return the correct value (13). (@acelaya This is why the demo page doesn't have this problem.)
  • According to https://github.com/i-like-robots/react-tags/issues/94, we might be able to workaround this issue by using change or input events instead of keydown.
  • This other library, react-tags, has a PR to fix the issue, but it's been open for 2 years now.

OliverJAsh avatar Aug 07 '19 14:08 OliverJAsh

Hello,

I saw this issue was linking to a report of the same problem on a component I maintain which I've been trying to solve recently. This is the best "solution" I have come up with so far for supporting delimiter keys which are not mapped on soft keyboards: https://github.com/i-like-robots/react-tags/pull/181

It works on all the devices tested so far (with the component configured to use comma and semi-colon delimiters) so I plan to ship this in the near future.

i-like-robots avatar Oct 29 '19 15:10 i-like-robots