issues with controlled TextInput with text replacement, "." shortcut on iOS

[chrisdrackett]

React Native version: 0.61.4

Steps To Reproduce

1. Create a TextInput component:

        <TextInput
          onChangeText={setValue}
          value={value}
        />

2. In iOS settings > general > keyboard make sure that "." Shortcut is on.
3. make sure "Check Spelling" is on.
4. make sure at least one thing is available in "Text Replacement" (omw should be there by default)
5. within the text input you created type some misspelled text.
6. press space twice after your text
7. type the text replacement shortcut

Describe what you expected to happen:

1. Miss-spelled text should have a red underline
2. there should be a period when space is pressed twice
3. text replacement shortcut should be replaced with its matching text.

The above will not be true when using value on a TextInput. If you remove the value prop and have the component uncontrolled the above all works as expected. Also, if the component is made multiline the above all work as expected, even in the controlled case.

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

https://snack.expo.io/H18J_rWlI

[RobPando]

I am running into the same issue. it works when the shortcut is a-z like if you make a text replacement "smh" -> shake my head it works but if it is any special character such as a text replacement "@@" -> [email protected] it does not work UNLESS you enable multiline

[stale]

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.

[chrisdrackett]

this issue has not been fixed, not sure how to get it more attention

[ozer]

+1

[thomas-negrault]

I see I'am not the only one with the @@ shortcut for my email. Setting the multiline option solved the issue but introduce a new one for me: If I hit the return key (which in my case is returnKeyType="next") it add a new \n to my input value. So it's not really solved.

[chrisdrackett]

does this issue need a needs triage label? /cc @cpojer

[husenLogicwind]

I am also running into the same issue.
"react": "16.9.0",
"react-native": "0.61.3",

[sonnd08]

The same with me, any update on this?
"react": "16.11.0",
"react-native": "0.62.2",

[maronk]

Same problem here - exact same versions as @sonnd08
"react": "16.11.0",
"react-native": "0.62.2",

[mhoran]

Related to #22078 and possibly #29572. I found that my fix for #29572 works around this issue, but it's not great and doesn't work for everyone.

[brightsider]

Any news?

[trackwell-mike]

This is one of the telltale signs someone has built their app in React Native, that iOS Text Replacement doesn't work.

Any update?

[seba-montagna-rocketlab]

Any news on this issue? Still randomly happens in TextInputs that are not multiline.
https://snack.expo.dev/kdvZ6ciy8

[github-actions]

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]

This issue was closed because it has been stalled for 7 days with no activity.

[chrisdrackett]

guess thats what I get for going on vacation :\

[hasebsiddiqui]

ANy update ?

[gedu]

@chrisdrackett @mhoran Hey, I'm looking at it and I think I found a possible solution: Here is where I posted everything: #37437

[nicotroia]

I'm still getting this issue on "react-native": "0.70.8". Text replacement on iOS doesn't work unless multiline is enabled on the TextInput

[ZONTeek]

still an issue "react-native": "0.71.3"

[gedu]

I'm looking at it again, My Mac broke and took a while to fix it

[gedu]

PR created: #39385

[NickGerleman]

Likely fixed in new arch with #46970 (thanks @gedu for linking me to this!)

[mhoran]

@NickGerleman I tried applying your patch to an Expo v52 (React Native 0.76.0) project using New Arch. Unfortunately it doesn't seem to resolve this issue and the workaround I referenced earlier no longer works in 0.76.0 and New Arch.

Perhaps I did something wrong, but I'm fairly certain the patch is applying and it doesn't seem to change the behavior.

@cortinico would you please reopen this issue?

[gedu]

I can give a second look (?)

[mhoran]

Here is a reproducer with the patch applied: https://github.com/mhoran/new-arch-autocorrect-repro. I also opened a pick request (reactwg/react-native-releases#595) though it's a bit moot since the bug does not seem to be fixed.

[mhoran]

This should be fixed in main by #47269 and #46970. I've filed a pick request for 0.76. For those who want to test sooner, you can apply the patches to 0.76.0 via patch-package as shown in the reproducer.