2

I am looking to implement the "Suggest strong password" feature from iOS on my app. My text input looks like this:

<TextInput
  textContentType="newPassword"
  passwordRules="minlength: 8;"
  value={password}
  onChangeText={setPassword}
  secureTextEntry
  autoCapitalize="none"
/>

This should work with the textContentType="newPassword" but the yellow bar with suggestion just doesn't show. I only get Passwords option on the prediction bar that opens my password storage.

I have keychain turned on and I've confirmed that the feature works for other apps like Reddit so the problem is not in the system settings. How do I make this work?

P.S. I am aware of react native suggest a new strong password and React Native Expo iOS Use Strong Password feature not working, the first is not the same as my issue and second uses expo which I'm not.

Zygro
  • 6,849
  • 11
  • 28
  • 43

1 Answers1

0

The issue seems to be with secureTextEntry - I haven't done enough research to know why but the below may work for you.

Not a optimal solution, but adding blurOnSubmit, and a keyboard Dismiss on submit seems to get the desired behavior back:

import { Keyboard } from 'react-native'

<TextInput
   ...
   blurOnSubmit={false}
   onSubmitEditing={()=> Keyboard.dismiss()}
/>

Or if you prefer, this may work for you also.

textContentType={'oneTimeCode'}

Ref: React Native - secureTextEntry Disable IOS 13+ Strong Password behavior

Aleksandar Zoric
  • 1,343
  • 3
  • 18
  • 45