react-native
react-native copied to clipboard
iOS "Hide my email" does not set the email in TextInput
Description
I have a TextField that accepts an email address.
<TextInput style={styles.input} value={email} onChangeText={setEmail} textContentType='emailAddress keyboardType='email-address placeholder="Enter email address" />
If I now use the "Hide my email" workflow on iOS instead of entering an email address, the TextInput field remains empty and is not set to the generated email address.
React Native Version
0.72.1
Output of npx react-native info
System: OS: Windows 10 10.0.19044 CPU: (20) x64 12th Gen Intel(R) Core(TM) i7-12700K Memory: 21.01 GB / 31.75 GB Binaries: Node: version: 18.16.1 path: C:\Program Files\nodejs\node.EXE Yarn: version: 1.22.19 path: C:\Program Files (x86)\Yarn\bin\yarn.CMD npm: version: 9.5.1 path: C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: Not Found Windows SDK: Not Found IDEs: Android Studio: Not Found Visual Studio: Not Found Languages: Java: Not Found Ruby: Not Found npmPackages: "@react-native-community/cli": Not Found react: installed: 18.2.0 wanted: 18.2.0 react-native: installed: 0.72.1 wanted: ^0.72.1 react-native-windows: Not Found npmGlobalPackages: "react-native": Not Found Android: hermesEnabled: Not found newArchEnabled: Not found iOS: hermesEnabled: Not found newArchEnabled: Not found
Steps to reproduce
- Create a new app
- `import { TextInput, View, StyleSheet } from "react-native"; import React, { useState } from "react";
export default function App() { const [email, setEmail] = useState("");
const styles = StyleSheet.create({ container: { flex: 1, justifyContent: "center", alignItems: "center", }, input: { width: "80%", height: 40, borderColor: "gray", borderWidth: 1, padding: 10, }, });
return ( <View style={styles.container}> <TextInput style={styles.input} value={email} onChangeText={setEmail} textContentType="emailAddress" keyboardType="email-address" placeholder="Enter email address" /> </View> ); } `
Snack, code example, screenshot, or link to a repository
https://snack.expo.dev/@febis001/hide-my-email
what do you mean by If I now use the "Hide my email" workflow on iOS instead of entering an email address
? your snack doesn't show what you mean
@Ahmedhamed77, Hide my Email works only if you have iCloud+
This is the feature I mean. First video shows a working example from another app (spotify in this case), and the second shows the react native app I'm working on.
https://github.com/facebook/react-native/assets/49189947/9c6783ba-0e69-4928-b130-5bf5792000b1
https://github.com/facebook/react-native/assets/49189947/fbfc1de5-194e-47b6-837d-5f07047ee28b
Have the same issue.
Also having this issue
Same issue here as well
Any update here? Anyone able to find a workaround?
big +1 any updates or work arounds here?
I have the same problem on iOS 16. On iOS 17 it works fine.
can also confirm that iOS 17 fixed whatever the issue was
Using RN 0.72.6 on iOS 17.2.1, tapping Hide My Email copies the text 'Hide My Email' into my textinput. Any way to disable 'hide my email' while still allowing email address suggestions?
@erikmillergalow same issue for me.
Even the NextDoor mobile app does it as well.
any fix ? or why we have this now ? i didn't had "hide my email" suggestion few months ago