TextInput is rerendered with artifacts (flickering)
See original GitHub issueWhen I start typing on a keyboard into TextInput component, text is rerendered incorrectly, with flickering and shaking.
React Native version: 0.60.5 React Native Info: System: OS: Linux 4.15 Ubuntu 18.04.3 LTS (Bionic Beaver) CPU: (8) x64 Intel® Core™ i7-4770K CPU @ 3.50GHz Memory: 7.17 GB / 15.60 GB Shell: 4.4.20 - /bin/bash Binaries: Node: 12.6.0 - ~/.local/opt/node-v12.6.0-linux-x64/bin/node Yarn: 1.12.3 - /usr/bin/yarn npm: 6.10.3 - ~/.local/opt/node-v12.6.0-linux-x64/bin/npm Watchman: 4.9.0 - /home/likern/.local/bin/watchman SDKs: Android SDK: API Levels: 23, 25, 26, 27, 28 Build Tools: 28.0.3 System Images: android-27 | Google APIs Intel x86 Atom, android-28 | Intel x86 Atom_64 npmPackages: react: 16.8.6 => 16.8.6 react-native: 0.60.5 => 0.60.5 npmGlobalPackages: react-native-cli: 2.0.1
Phone version: Model: Xiaomi Redmi 5A Android version: 8.1.0 MIUI version: Global 10.3.2
Steps To Reproduce
- Create simple TextInput component
- Create wrapper for TextInput with state
- Start typing into TextInput component inside application
Describe what you expected to happen: Clean text rendering and re-rendering without flickering and shaking.
Source code: This simplest component is able to reproduce bug:
const ScrollInput = props => {
const [text, setText] = useState('default text');
const onChangeText = text => setText(text);
return <TextInput value={text} onChangeText={onChangeText} />;
};

Issue Analytics
- State:
- Created 4 years ago
- Comments:6

Top Related StackOverflow Question
I have the same issue with iOS also, but it’s not as bad as with Android. TextInput is almost unusable at the moment.
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.