When multiline=true, TextInput's onChangeText() callback may not fire.

[ShadReyes]

Description

I am working on a chat feature in an app. It works like most chat features. If you type a message and submit, the text is cleared.

The problem is that after clearing the TextInput (input focus is maintained) the first character typed does not fire the onChangeText() callback.

This only is a problem when multiline=true

React Native Version

0.71.10

Output of npx react-native info

System:
OS: macOS 13.4
CPU: (8) x64 Intel(R) Core(TM) i7-7700K CPU @ 4.20GHz
Memory: 1.30 GB / 24.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 16.17.0 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 9.6.1 - /usr/local/bin/npm
Watchman: Not Found
Managers:
CocoaPods: 1.12.1 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 22.4, iOS 16.4, macOS 13.3, tvOS 16.4, watchOS 9.4
Android SDK: Not Found
IDEs:
Android Studio: Not Found
Xcode: 14.3/14E222b - /usr/bin/xcodebuild
Languages:
Java: 18.0.2 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: Not Found
react-native: Not Found
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

1. Tap on TextInput
2. Type "hello world"
3. Press "submit". Text should be cleared
4. Type "H"
5. Press "submit". Text will not clear because onChangeText() will not fire.

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

const MessageInput = () => {
  const [message, setMessage] = useState('');

  const submit = () => {
    if(!message) {
      return;
    }
    setMessage('');
  }

  return (
    <>
        <TextInput
            placeholder='Message'
            placeholderTextColor={themes.texts.colors.placeholder}
            multiline={true}
            value={message}
            onChangeText={setMessage}
        />
        <Button title={'submit'} onPress={() => submit()}/>
    </>
  );
}

[github-actions]

⚠️

Newer Version of React Native is Available!

ℹ️

You are on a supported minor version, but it looks like there's a newer patch available - 0.71.10. Please upgrade to the highest patch for your minor or latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If it does not repro, please let us know so we can close out this issue. This helps us ensure we are looking at issues that still exist in the most recent releases.

[kkoudev]

same issue.
Reverting the below changes worked fine.
a804c0f

[nmalzieu]

Hi, I have the same issue (on iOS only, android works well)
I can confirm I have the same issue with version 0.71.10

[ShadReyes]

I have confirmed for v0.71.10 as well that the issue still exists.

[kkoudev]

This is an additional information.
This issue has occurred from v0.71.8 below changes.
a804c0f

Therefore, it is possible to work around this by creating a patch that reverts this fix.

[nmalzieu]

Thanks @kkoudev , but I guess this fix was useful for another reason? (not firing onChange too often?)

[kkoudev]

@nmalzieu
Yes. If I revert the v0.71.8 fix, the issue (#36494) reoccurs.
I can't decide which one should be prioritized because it depends on the application,
If possible, the fix for #36494 should be re-fixed so that it no longer causes this issue.

[kkoudev]

I've created a PR (#37958) to fix this issue without recurring the #36494 issue.