TextInput with SecureEntry sometimes highlights yellow with "Strong Password" text, and becomes unuseable
See original GitHub issue- Review the documentation: https://facebook.github.io/react-native
- Search for existing issues: https://github.com/facebook/react-native/issues
- Use the latest React Native release: https://github.com/facebook/react-native/releases
Environment
React Native Environment Info: System: OS: macOS 10.14 CPU: x64 Intel® Core™ i7-7820HQ CPU @ 2.90GHz Memory: 54.86 MB / 16.00 GB Shell: 5.3 - /bin/zsh Binaries: Node: 8.12.0 - ~/.nvm/versions/node/v8.12.0/bin/node Yarn: 1.9.4 - ~/.yarn/bin/yarn npm: 6.4.1 - ~/.nvm/versions/node/v8.12.0/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman SDKs: iOS SDK: Platforms: iOS 12.0, macOS 10.14, tvOS 12.0, watchOS 5.0 IDEs: Xcode: 10.0/10A255 - /usr/bin/xcodebuild npmPackages: react: 16.6.0-alpha.8af6728 => 16.6.0-alpha.8af6728 react-native: ^0.57.3 => 0.57.3 npmGlobalPackages: react-native-cli: 2.0.1
Description
I haven’t been able to identify why this occurs, but sometimes users experience a yellow cover over the textField, with a “Strong Password” text on the right, and something cut off on the left. I can still tap the textInput and “Type” but the value does not change within the textInput.
(The red x, and warning text is my own)
I’ve tried adding, and removing textContentType="password"
, but this issue still persists.
Issue Analytics
- State:
- Created 5 years ago
- Reactions:47
- Comments:55 (1 by maintainers)
Top GitHub Comments
Combining @iamgerardm solution with a Keyboard dismiss on submit seems to get the desired behavior back. `import { Keyboard } from ‘react-native’
blurOnSubmit={false} onSubmitEditing={()=> Keyboard.dismiss()}`
I am seeing the same thing. I will add that in my case the fields do not get blocked unless I use the next/done feature. Which is tough since typically password is last for a signup/signin form.
Edit: adding blurOnSubmit={false} seems to prevent this behavior