TextInput crashes an app if Samsung Keyboard uses Predictive Text & Suggest text corrections

[BohdanSol]

Description

Main issue: Generated release .apk TextInput crash the app on Samsung when Predictive Text & Suggest text corrections is activated.
React-native versions checked: 0.63.3, 0.67.2
Phones produced the issue: Samsung S20 Ultra, Samsung Galaxy S21 Plus
Another possible issue: For all the crashes captured some parts of the text were underlined green or red, maybe the issue is with that suggestions...
It was first produced by the production project based on 0.63.3v, then I created bare 0.67.2v project and added simple TextInput, and the issue still exists. Attaching a video so everybody can replicate.

record-20220217-094302.mp4

Version

0.63.3, 0.67.2

Output of npx react-native info

System:
OS: macOS 12.2.1
CPU: (8) arm64 Apple M1
Memory: 439.56 MB / 16.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 17.2.0 - /opt/homebrew/bin/node
Yarn: 1.22.17 - /opt/homebrew/bin/yarn
npm: 8.1.2 - /usr/local/bin/npm
Watchman: 2021.12.13.00 - /opt/homebrew/bin/watchman
Managers:
CocoaPods: 1.11.2 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3
Android SDK:
API Levels: 29, 30, 32
Build Tools: 28.0.3, 29.0.2, 30.0.0, 30.0.2, 32.0.0
System Images: android-29 | Google APIs Intel x86 Atom, android-29 | Google Play ARM 64 v8a, android-31 | Google APIs ARM 64 v8a, android-32 | Google APIs ARM 64 v8a, android-32 | Google APIs Intel x86 Atom_64
Android NDK: Not Found
IDEs:
Android Studio: 2020.3 AI-203.7717.56.2031.7935034
Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild
Languages:
Java: 1.8.0_292 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 17.0.2 => 17.0.2
react-native: 0.67.2 => 0.67.2
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

1. Get my repo: https://github.com/BohdanSol/projectTwo
2. yarn install
3. Generate keystore, put it inside android>app. Change values regarding keystore inside gradlew.properties
4. From root cd android && ./gradlew assembleRelease
5. Test generated apk in real device

Snack, code example, screenshot, or link to a repository

https://github.com/BohdanSol/projectTwo

[BohdanSol]

UPD: Seems like it's related with Samsung devices upgraded to Android 12

[kcsuyog]

I have the same issue.
For us, it's mostly happening with SM-G998B and SM-G991B on Android 12

[tarouboy]

Not sure is it related but received app crash when typing.
here's the log from Sentry

java.lang.IllegalStateException: Drag shadow dimensions must be positive
    at android.view.View.startDragAndDrop(View.java:26740)
    at android.widget.Editor.startDragAndDrop(Editor.java:1393)
    at android.widget.Editor.performLongClick(Editor.java:1432)
    at android.widget.TextView.performLongClick(TextView.java:12405)

[BohdanSol]

@tarouboy For me it's:

android.text.SpannableStringInternal in getSpanFlags at line 331
android.text.SpannableString in getSpanFlags at line 24
android.text.SpannableStringInternal in getSpans at line 389
android.text.SpannableString in getSpans at line 24
android.text.SpannableStringBuilder in change at line 431
android.text.SpannableStringBuilder in replace at line 560
android.text.SpannableStringBuilder in replace at line 518
android.text.SpannableStringBuilder in replace at line 39
android.view.inputmethod.BaseInputConnection in replaceText at line 945
android.view.inputmethod.BaseInputConnection in commitText at line 219
com.android.internal.widget.EditableInputConnection in commitText at line 204
com.android.internal.view.IInputConnectionWrapper in executeMessage at line 561
com.android.internal.view.IInputConnectionWrapper$MyHandler in handleMessage at line 118
android.os.Handler in dispatchMessage at line 106
android.os.Looper in loopOnce at line 226
android.os.Looper in loop at line 313
android.app.ActivityThread in main at line 8582
java.lang.reflect.Method in invoke
com.android.internal.os.RuntimeInit$MethodAndArgsCaller in run at line 563
com.android.internal.os.ZygoteInit in main at line 1133

[BohdanSol]

@JoshuaGross , @RSNara , @mdvacca , sorry for mentioning you all straight, but It seems very important issue for me. Maybe somebody can take at least a quick look at the repo I attached and give this higher priority status.

[rakefetWorkiz]

we having the exact same issue.
this is real show stopper 🤦‍♀️

[efstathiosntonas]

Any updates regarding this issue? It’s happening on both Android 11 & 12 (rn 0.67.3), we get lot’s of crashes every day. It also lags a lot if a user enters a big block of text and it leads to ANR.

[JuanAlejandro]

We were able to reproduce this bug and we found that setting autoCorrect to false in the TextInput solves the issue. We are planning to roll out this soon and expect ANR numbers to go down. I'll keep you posted.

Try this and let me know if it works for you.

P.S.: Since this is happening only for Samsung devices with Android 12 I made this util to only set autoCorrect to false when the device meets these props:

import { toLower } from 'lodash';
import { getSystemVersion, useManufacturer } from 'react-native-device-info';

export const useIsSamsungWithAndroid12 = (): boolean => {
  const { loading, result } = useManufacturer();
  const systemVersion = getSystemVersion();

  return !loading && toLower(result) === 'samsung' && systemVersion.startsWith('12');
};

[BohdanSol]

@JuanAlejandro working as expected as workaround for this kind of issue. Thank you very much!

[systemride]

@JuanAlejandro Any update on whether your fix continues to solve the issue?

[smali-kazmi]

any fix for this issue? because lot of our users facing the same issue if they have Samsung Device

[smali-kazmi]

We were able to reproduce this bug and we found that setting autoCorrect to false in the TextInput solves the issue. We are planning to roll out this soon and expect ANR numbers to go down. I'll keep you posted.

Try this and let me know if it works for you.

P.S.: Since this is happening only for Samsung devices with Android 12 I made this util to only set autoCorrect to false when the device meets these props:

import { toLower } from 'lodash';
import { getSystemVersion, useManufacturer } from 'react-native-device-info';

export const useIsSamsungWithAndroid12 = (): boolean => {
  const { loading, result } = useManufacturer();
  const systemVersion = getSystemVersion();

  return !loading && toLower(result) === 'samsung' && systemVersion.startsWith('12');
};

doesn't fix the issue