Repository navigation
TextInput order of events are inconsistent between iOS and Android #18221
Description
Activity
https://github.com/leighman/react-native-text-input-selection-crash for reproduction of crash when setting selection and text at the same time.
Works fine on iOS.
Crashes on Android unlessselectionis set in thesetTimeout.
Exists in 0.52 - 0.54 as far as I can tell.Reacted by Stan Chang- addedRan CommandsOne of our bots successfully processed a command.One of our bots successfully processed a command.Component: TextInputRelated to the TextInput component.Related to the TextInput component.
on Mar 13, 2018 Thanks for posting this! It looks like your issue may be missing some necessary information. Can you run
react-native infoand edit your issue to include these results under the Environment section?Thank you for your contributions.
- addedRan CommandsOne of our bots successfully processed a command.One of our bots successfully processed a command.
on Mar 16, 2018 - addedPlatform: AndroidAndroid applications.Android applications.Ran CommandsOne of our bots successfully processed a command.One of our bots successfully processed a command.
on Mar 18, 2018 11 remaining items
I have the same issue, I try to process input’s value on “Backspace” key so I store key in onKeyPress event handler and I use it in onChange event handler but I found undefined because onChange get fired before onKeyPress, please help
Experiencing this issue too. I have to use a differently ordered combination of onChangeText and onSelectionChange to handle the same text function on iOS and Android.
My workaround is acting like the
onKeyPressandonTextChangeevent but doing so ononChange. I have to manually find the string difference though to determine the "key" they pressed. This will act the SAME across iOS and Android.
Demo: https://snack.expo.io/@loonison101/handle-event-firing-discrepancy-rnonChange({nativeEvent}) { const {text: newText} = nativeEvent; const {value: oldText, onChange} = this.props; // onChange passed from the parent const key = findFirstDifferentChar(newFormattedText, oldText); onChange(key, newText); }findFirstDifferentChar(currentValue = '', beforeValue = '') { if (beforeValue.length > currentValue.length) { return 'Backspace'; // They backspaced, same name RN gives the char } let startIndex; [...currentValue].forEach((char, index) => { if (startIndex !== undefined) { return; } if (char !== beforeValue[index]) { startIndex = index; } }); return currentValue[startIndex || 0]; }<TextInput value={value} onChange={this.onChange} />Reacted by Marco Langebeeke, Thien Nguyen and Ryan DavidsonAlso seeing this on RN 0.59.1. There is no workaround other than to handle Android differently from iOS as far as I know
For me on RN 0.59.1 this gets even more weird.
I am testing on Android Emulator.When I press any letter then
Backspacemy events go consistent:- onChangeText, onKeyPress
- onChangeText, onKeyPress
But when I press any digit then
Backspacemy events go like- onChangeText, onKeyPress
- onKeyPress, onChangeText
Maybe that's for another issue though..
We're also having problems with this, would be great to get the order standardized. I think onKeyPress should always come before onChangeText.
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
- addedStaleThere has been a lack of activity on this issue and it may be closed soon.There has been a lack of activity on this issue and it may be closed soon.
on Nov 4, 2019 Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.
- locked as resolved and limited conversation to collaborators
on Nov 12, 2019
TextInput event order are different for iOS and Android.
This inconsistency make certain operations hard to archive on Android:
change text eventbeforeselection change eventcan cause crash due to invalid selection.Environment
Tested on Expo 25.0.0/0.52.0, but original issue happen in 0.53.3 as well, Likely exist in 0.54.0
Expected Behavior
I think iOS order of events make the most sense and I hope Android can follow the suit.
Actual Behavior
The event in question are
onChangeText(),onSelectionChange()andonKeyPress().On iOS, the events are in the following order:
On Android, the events are in the following order:
Steps to Reproduce
https://snack.expo.io/Hk2qtCouf