Repository navigation
Fast typing on TextInput field negates clearing the field #33947
Description
Description
This seems to be a regression. On a React-Native 0.67.2 does not happen, but on React-Native 0.68.2 seems to reproduce. Seems to reproduce also both on Android and iOS.
If you type fast into an input box, and then have a button that clears the text (be it by reassigning the value property, be it by using the setNativeProps), if you hit the button while you are typing, the box never gets cleared.
Version
0.68.2
Output of npx react-native info
System:
OS: Linux 5.4 Ubuntu 20.04.4 LTS (Focal Fossa)
CPU: (8) x64 Intel(R) Core(TM) i7-8665U CPU @ 1.90GHz
Memory: 509.04 MB / 31.02 GB
Shell: 5.0.17 - /bin/bash
Binaries:
Node: 14.17.1 - /usr/local/bin/node
Yarn: Not Found
npm: 7.19.1 - /usr/local/bin/npm
Watchman: 4.9.0 - /home/daniel/.linuxbrew/bin/watchman
SDKs:
Android SDK: Not Found
IDEs:
Android Studio: Not Found
Languages:
Java: 11.0.15 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 17.0.2 => 17.0.2
react-native: 0.68.2 => 0.68.2
npmGlobalPackages:
react-native: Not Found
Steps to reproduce
Fast type with one hand (this is easily done by just mashing the keys of a keyboard in the simulator, but works also on mobile) while you hit the button with the other.
The expected result is that when you hit the button, the field gets cleared, and the new input starts from zero.
The seen result is that when you hit the button, the field does not get cleared, it just keeps writing where it left.
If you stop typing and hit the button, it gets cleared correctly.
Snack, code example, screenshot, or link to a repository
export default function App() {
const [value, setValue] = useState('');
return (
<View style={styles.container}>
<TextInput value={value} onChangeText={setValue}/>
<Button title='clear' onPress={() => setValue('')}/>
</View>
);
}
Activity
enahum commentedon Jun 1, 2022
@kelset any chance someone with knowledge around the TextInput can take a look at this?
github-actions commentedon Nov 29, 2022
This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.
enahum commentedon Nov 29, 2022
This has not been fixed yet. @cortinico any updates?
github-actions commentedon Feb 19, 2024
This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.
github-actions commentedon Feb 26, 2024
This issue was closed because it has been stalled for 7 days with no activity.
BogomilRusevv commentedon Sep 2, 2024
Any solution to this?
nemorize commentedon Mar 6, 2026
Wrap
clear()withrequestAnimationFrame().While it's not a perfect solutionㅡissue still occurred in devmodeㅡ it works on my situation.