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

withAuthenticator warning: A component is changing an uncontrolled input of type text to be controlled. #5966

Open
3 tasks done
drewboardman opened this issue Oct 24, 2024 · 4 comments
Labels
Auth bug Something isn't working React Native An issue or a feature-request for React Native platform

Comments

@drewboardman
Copy link

Before opening, please confirm:

JavaScript Framework

React Native

Amplify APIs

Authentication

Amplify Version

v6

Amplify Categories

auth

Backend

Other

Environment information

System:
OS: macOS 15.0.1
CPU: (8) arm64 Apple M3
Memory: 27.88 MB / 8.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 23.0.0 - ~/.nvm/versions/node/v23.0.0/bin/node
Yarn: 1.22.22 - ~/.nvm/versions/node/v23.0.0/bin/yarn
npm: 10.9.0 - ~/.nvm/versions/node/v23.0.0/bin/npm
Watchman: 2024.10.21.00 - /opt/homebrew/bin/watchman
Browsers:
Brave Browser: 130.1.71.118
Safari: 18.0.1
npmPackages:
@aws-amplify/react-native: ^1.0.28 => 1.0.28
@aws-amplify/ui-react-native: ^2.1.5 => 2.1.5
@babel/core: ^7.20.0 => 7.24.4
@expo/vector-icons: ^14.0.0 => 14.0.0
@react-native-async-storage/async-storage: ^1.23.1 => 1.23.1
@react-native-community/netinfo: ^11.3.1 => 11.3.1
@react-navigation/native: ^6.0.2 => 6.1.17
@types/react: ~18.2.45 => 18.2.79
HelloWorld: 0.0.1
aws-amplify: ^6.0.28 => 6.0.28
aws-amplify/adapter-core: undefined ()
aws-amplify/analytics: undefined ()
aws-amplify/analytics/kinesis: undefined ()
aws-amplify/analytics/kinesis-firehose: undefined ()
aws-amplify/analytics/personalize: undefined ()
aws-amplify/analytics/pinpoint: undefined ()
aws-amplify/api: undefined ()
aws-amplify/api/server: undefined ()
aws-amplify/auth: undefined ()
aws-amplify/auth/cognito: undefined ()
aws-amplify/auth/cognito/server: undefined ()
aws-amplify/auth/enable-oauth-listener: undefined ()
aws-amplify/auth/server: undefined ()
aws-amplify/data: undefined ()
aws-amplify/data/server: undefined ()
aws-amplify/datastore: undefined ()
aws-amplify/in-app-messaging: undefined ()
aws-amplify/in-app-messaging/pinpoint: undefined ()
aws-amplify/push-notifications: undefined ()
aws-amplify/push-notifications/pinpoint: undefined ()
aws-amplify/storage: undefined ()
aws-amplify/storage/s3: undefined ()
aws-amplify/storage/s3/server: undefined ()
aws-amplify/storage/server: undefined ()
aws-amplify/utils: undefined ()
expo: ~50.0.14 => 50.0.17
expo-auth-session: ~5.4.0 => 5.4.0
expo-crypto: ~12.8.1 => 12.8.1
expo-font: ~11.10.3 => 11.10.3
expo-linking: ~6.2.2 => 6.2.2
expo-router: ~3.4.8 => 3.4.8
expo-secure-store: ~12.8.1 => 12.8.1
expo-splash-screen: ~0.26.4 => 0.26.4
expo-status-bar: ~1.11.1 => 1.11.1
expo-system-ui: ~2.9.3 => 2.9.4
expo-web-browser: ~12.8.2 => 12.8.2
jest: ^29.2.1 => 29.7.0
jest-expo: ~50.0.4 => 50.0.4
react: 18.2.0 => 18.2.0
react-dom: 18.2.0 => 18.2.0
react-native: 0.73.6 => 0.73.6
react-native-get-random-values: ^1.11.0 => 1.11.0
react-native-safe-area-context: ^4.8.2 => 4.9.0
react-native-screens: ~3.29.0 => 3.29.0
react-native-web: ~0.19.6 => 0.19.10
react-test-renderer: 18.2.0 => 18.2.0
typescript: ^5.1.3 => 5.4.5
npmGlobalPackages:
corepack: 0.29.4
npm-check-updates: 17.1.4
npm: 10.9.0
yarn: 1.22.22

Describe the bug

Here is a minimal repo that will experience the bug. Please ignore the instructions for the other bug in the README.

It seems to be a bug that has been reported in 2022.

Run the project in the browser and click the username field. You will see the following issue:

hook.js:608 Warning: A component is changing an uncontrolled input to be controlled. This is likely caused by the value changing from undefined to a defined value, which should not happen. Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components
    at input
    at LocaleProvider (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:12180:27)
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:65250:39
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at TextField (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:184887:35)
    at Field (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:185992:21)
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at DefaultTextFormFields (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:185891:36)
    at DefaultContent (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:183120:21)
    at SignIn (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:187435:23)
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at InnerContainer (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:183067:25)
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:51740:26
    at ScrollView (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:50943:36)
    at ScrollView
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at KeyboardAvoidingView (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:63444:36)
    at DefaultContainer (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:182706:38)
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at NativeSafeAreaProvider (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:103479:25)
    at SafeAreaProvider (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:103347:25)
    at Authenticator (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:158951:26)
    at AuthenticatorProvider (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:159189:25)
    at App (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:88909:44)
    at Try (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:80281:7)
    at Suspense
    at Route (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:77657:25)
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:78015:25
    at div
    at http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:47271:27
    at NativeSafeAreaProvider (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:103479:25)
    at SafeAreaProvider (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:103347:25)
    at wrapper (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:85497:28)
    at EnsureSingleNavigator (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:98058:25)
    at BaseNavigationContainer (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:96633:29)
    at ThemeProvider (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:101691:22)
    at NavigationContainerInner (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:101582:27)
    at ContextNavigator (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:85531:25)
    at ExpoRoot (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:85488:29)
    at r (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:191841:23)
    at App
    at LogBoxStateSubscription (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:67517:9)
    at ErrorOverlay
    at withDevTools(ErrorOverlay)
    at AppContainer (http://localhost:8081/node_modules/expo-router/entry.bundle?platform=web&dev=true&hot=false&lazy=true&transform.routerRoot=app&resolver.environment=client&transform.environment=client:61210:25)

Expected behavior

This console error should not appear.

Reproduction steps

Here is a minimal repo that will experience the bug. Please ignore the instructions for the other bug in the README.

It seems to be a bug that has been reported in 2022.

Run the project in the browser and click the username field. You will see the following issue:

Code Snippet

// Put your code below this line.

Log output

// Put your logs below this line


aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

@github-actions github-actions bot added pending-triage Issue is pending triage pending-maintainer-response Issue is pending response from an Amplify UI maintainer labels Oct 24, 2024
@cwomack cwomack added Auth React Native An issue or a feature-request for React Native platform labels Oct 24, 2024
@cwomack cwomack self-assigned this Oct 24, 2024
@cwomack cwomack added question General question and removed pending-triage Issue is pending triage labels Oct 24, 2024
@cwomack
Copy link
Member

cwomack commented Oct 25, 2024

Hello, @drewboardman 👋 and thanks for opening this issue. This looks like it's more related to the withAuthenticator component that the amplify-ui repo handles, so we'll transfer it over there for better assistance.

@cwomack cwomack transferred this issue from aws-amplify/amplify-js Oct 25, 2024
@github-actions github-actions bot added the pending-triage Issue is pending triage label Oct 25, 2024
@jacoblogan
Copy link
Contributor

Thank you for bringing this issue to our attention and for the reproduction. We are looking into the bug and will update here.

@jacoblogan jacoblogan added bug Something isn't working being-investigated and removed question General question pending-triage Issue is pending triage pending-maintainer-response Issue is pending response from an Amplify UI maintainer labels Oct 29, 2024
@cwomack cwomack removed their assignment Oct 30, 2024
@Justinon
Copy link

Justinon commented Nov 7, 2024

Related: aws-amplify/amplify-js#13337

@github-actions github-actions bot added the pending-maintainer-response Issue is pending response from an Amplify UI maintainer label Nov 7, 2024
@cwomack cwomack removed the pending-maintainer-response Issue is pending response from an Amplify UI maintainer label Nov 7, 2024
@github-actions github-actions bot added the pending-maintainer-response Issue is pending response from an Amplify UI maintainer label Nov 8, 2024
@hbuchel hbuchel removed the pending-maintainer-response Issue is pending response from an Amplify UI maintainer label Nov 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Auth bug Something isn't working React Native An issue or a feature-request for React Native platform
Projects
None yet
Development

No branches or pull requests

6 participants
@hbuchel @jacoblogan @drewboardman @Justinon @cwomack and others