React-native: Using `toUpperCase` or `textTransform: 'uppercase'` breaks on an Android controlled TextInput

[nick-michael]

React Native version: 0.61.4 and lower

Trying to force capitalization of characters inside a TextInput is broken on Android.

• autoCapitalize="characters" doesn't seem to do anything
• Using toUpperCase in the onChangeText hook causes duplication of letters
• Using textTransform: 'uppercase' in styles block causes the same duplication of letters
• Using textTransform: 'uppercase' in a non-controlled TextInput does nothing

Steps To Reproduce

1. Create a controlled TextInput and either use onTextChanged to modify the text to uppercase or use text transform in the styles block
2. Type multiple lowercase characters into the text box

Describe what you expected to happen:
Characters should be capitalized

What actually happens:
Characters are capitalized and duplicated

Snack, code example, screenshot, or link to a repository:
https://snack.expo.io/@nmi09/rn-android-capitalize-input-bug

[inferusvv]

Yeah. The same issue! On iOS all works fine

[ghost]

Same issue for me....

[laraferroni]

Had same issue. Adding
secureTextEntry={Platform.OS === 'ios' ? false : true}
seemed to fix it for me.

[YeshanJay]

Any luck finding a workaround for this??

[simon-davies-avtura]

keyboardType={Platform.OS === 'ios' ? 'default' : 'visible-password'}

Seems to be the only workaround for me with Android at the moment (I've been looking for ages!). Will need some cross platform testing locally though.

[emilioheinz]

Really weird, it worked but I think that should be fixed asap.

keyboardType={Platform.OS === 'ios' ? 'default' : 'visible-password'}

Seems to be the only workaround for me with Android at the moment (I've been looking for ages!). Will need some cross platform testing locally though.

[arthurolga]

i have the same problem. The solution by simon-davies-avtura solved it partially, but I really wanted to use keyboardType='email-address'. If there is any other workaround or a solution. I just want to display the font in lowerCase on the UI.

[fabriziobertoglio1987]

seems similar issue to https://github.com/facebook/react-native/issues/11068#issuecomment-574013816

It is difficult to fix this issue related to Rich Text, more info in Pull Request https://github.com/facebook/react-native/pull/27757

[stale[bot]]

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.

[jamesdarabi]

This issue is still present in React Native version: 0.63.2

[lorenamelor]

I have the same problem.

[arthurolga]

autoCapitalize={'characters'}
Seems to solve the problem.
https://www.reddit.com/r/reactnative/comments/jhdref/any_solution_to_the_touppercase_problem