Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Android: Controlled TextInput Issue on Some Androids #19085

Closed
3 tasks done
Noitidart opened this issue May 1, 2018 · 26 comments
Closed
3 tasks done

Android: Controlled TextInput Issue on Some Androids #19085

Noitidart opened this issue May 1, 2018 · 26 comments
Labels
Bug Component: TextInput Related to the TextInput component. Platform: Android Android applications. Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@Noitidart
Copy link

Noitidart commented May 1, 2018

All my tests are done on a real device.

On some Android's, the controlled TextInput is not being controlled correctly and causes all kinds of problems. For demo I simplified it down to <TextInput value="Hello" />, and now typing in this box you will see weird characters show momentarily.

Here are some bigger issues caused by this root issue:

This has been impacting me in all RN versions (I think I started RN with something in the 50s). I have two Android devices. This bug happens to me only on one of them.

Environment

Environment:
OS: Windows 10
Node: 8.4.0
Yarn: 0.19.1
npm: 6.0.0
Watchman: Not Found
Xcode: N/A
Android Studio: Version 2.3.0.0 AI-162.3764568

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: 0.55.3 => 0.55.3

Steps to Reproduce

  1. Render <TextInput value="Hello" />
  2. Type in it, you will see flashes of bad text (characters you did not just push)

Here is a snack - https://snack.expo.io/@noitsnack/controlled-textinput-issue-on-some-androids

Expected Behavior

Only the character I just typed should flash. Flash because native side gets new character and then syncs with js, which is controlled value. (ideally we have no flash, but this is understandable, and this is not the goal of this issue)

Actual Behavior

Here is a gif, we see my original text gets "duplicated" on second character press.

@thymikee
Copy link
Contributor

thymikee commented May 8, 2018

Just to chime in, I can reproduce this behavior on RN 0.55.3, LG G2, Android 5.0.1 (stock).

@Noitidart
Copy link
Author

Thank you very much @thymikee - are you able to reproduce the externally linked snacks too for the more complex examples?

@thymikee
Copy link
Contributor

thymikee commented May 8, 2018

@Noitidart yep, exact the same bahvior as on attached gifs

@Noitidart
Copy link
Author

Thank you very much for the note on reproduction. I was having a hard time finding others, but after having this bug for a couple months I was sure of it so posted here.

@stale
Copy link

stale bot commented Aug 6, 2018

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 "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Aug 6, 2018
@Noitidart
Copy link
Author

"For Discussion"

This hasn't been fixed, it's a major issue that still needs discussion to figure out which devices are causing this. And then troubleshooting on those devices.

@stale stale bot removed the Stale There has been a lack of activity on this issue and it may be closed soon. label Aug 6, 2018
@CptFabulouso
Copy link

For me this happens on phone LG G4, android 6.0, RN version 0.56.0

@iChaosren
Copy link

Having the same issue on multiple different android devices on RN version 0.57.0

@dsgoers
Copy link

dsgoers commented Jan 8, 2019

I'm getting this issue too. Has anyone found a workaround?

@Noitidart
Copy link
Author

Noitidart commented Jan 8, 2019

Not yet @dsgoers :(

There is a super nasty workaround, where you make a programtic selection and give it enough time for the selection to take affect, but no way to ensure it took affect, just wait long enough. Super nasty.

@dsgoers
Copy link

dsgoers commented Jan 8, 2019

Ah ok. Thanks for the quick response. Hopefully this can get fixed soon.

@NotedToSelf
Copy link

I'm having the exact same issue, just chiming in to say it's happening on a Pixel 2 XL

@Noitidart
Copy link
Author

Thanks for the vote @NotedToSelf - I am also still having the problem.

@dreadrocksean

This comment has been minimized.

@tattivitorino
Copy link

I'm having this issue as well! It wasnt like this untill I ejected my app from Expo! I'm using redux-form so I have a Field that renders the component with the native-base Input which renders the react-native TextInput.

@tattivitorino
Copy link

The main problem seems to be related to redux-form! When wrapped by Field the problem occurs on both IOS and Android!

@Noitidart
Copy link
Author

Noitidart commented Jul 30, 2019

The main problem seems to be related to redux-form! When wrapped by Field the problem occurs on both IOS and Android!

This happens without redux-form - 2 of the 3 examples (with screencasts) posted are not redux-form.

@tattivitorino
Copy link

tattivitorino commented Jul 30, 2019

@Noitidart in my case it is the Field of redux-form! Before I eject my app from Expo it was not happening! I also upgraded from expo 32 to 33 as well as redux-form 8.1.0 to 8.2.5! O f course I have many possibilities that could be causing this, but all the inputs that are not wrapped by redux-form are working perfectly! I'm sorry if I didnt make myself clearer!!

@WoodyWoodsta
Copy link

I'm having the same issue as well. I'm on:

  • RN 0.60.4
  • Redux Form 8.2.5
  • Pixel 3XL and Pixel 2XL
  • Hermes and no-Hermes

@ITsolution-git
Copy link

This problem still persists. Is there any progress?

@Noitidart
Copy link
Author

Noitidart commented Sep 5, 2019 via email

@edipkavvas
Copy link

This happens when autocomplete is active on the phone and if the keyboard type of the TextInput supports autocomplete suggestions (like default or email). If you assign 'visible-password' to keyboardType of TextInput, the problem will dismiss. But still this situation is a bug

@stale
Copy link

stale bot commented Feb 20, 2020

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.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Feb 20, 2020
@Noitidart
Copy link
Author

Noitidart commented Feb 20, 2020 via email

@stale stale bot removed the Stale There has been a lack of activity on this issue and it may be closed soon. label Feb 20, 2020
@stale
Copy link

stale bot commented May 20, 2020

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.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label May 20, 2020
@stale
Copy link

stale bot commented May 30, 2020

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.

@stale stale bot closed this as completed May 30, 2020
@facebook facebook locked as resolved and limited conversation to collaborators May 31, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Bug Component: TextInput Related to the TextInput component. Platform: Android Android applications. Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests