Federated login in react native requires two login attempts to work only on production ANDROID

[OtayNacef]

Before opening, please confirm:

• [X] I have searched for duplicate or closed issues and discussions.
• [X] I have read the guide for submitting bug reports.
• [X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React Native

Amplify APIs

Authentication

Amplify Version

v6

Amplify Categories

auth

Backend

Other

Environment information

``` npmPackages: ... @aws-amplify/react-native: 1.0.13 => 1.0.13 @aws-amplify/rtn-web-browser: 1.0.13 => 1.0.13 aws-amplify: 6.0.13 => 6.0.13 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/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 () axios: 1.6.7 => 1.6.7 react: 18.2.0 => 18.2.0 react-native: 0.73.3 => 0.73.3 (0.73.2) yarn: ^1.22.21 => 1.22.21 npmGlobalPackages: appium: 2.4.1 corepack: 0.19.0 npm: 9.8.1 ```

Describe the bug

After migrating to Amplify v6 and deploying the app on production or internal test , I've encountered an issue with federated login on Android devices with no error returned . The problem occurs only during the initial login attempt with Google authentication. The user needs to sign in twice to be successfully authenticated. Interestingly, this issue is not present in non-production environments, and subsequent login attempts work as expected.

Expected behavior

The expected behavior is that users should be successfully authenticated on the first attempt when signing in with Google

Reproduction steps

1. Download the app from internal test (Android).
2. Attempt to sign in with Google for the first time.
3. Observe that the authentication process doesn't succeed on the first attempt.
4. Retry the sign-in by clicking again and selecting the Google account.
5. Confirm that the authentication works correctly on the second attempt.

Note: This issue is specific to production environments on Android, and subsequent login attempts after the initial occurrence function as expected.

Code Snippet

useEffect(() => {
Amplify.configure(awsconfig as ResourcesConfig);
    const unsubscribe = Hub.listen('auth', async ({payload}) => {
      switch (payload.event) {
        case 'signInWithRedirect': {
          await getUser();

          break;
        }
        }
    });

    return unsubscribe;
  }, [getUser]);

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

[cwomack]

Hello, @OtayNacef 👋. Sorry to hearing you're experiencing this issue. Are you able to share the frontend code that's causing this behavior? And is this on Android emulators or real, physical devices?

[OtayNacef]

Hello, @cwomack. I've conducted testing on an actual Samsung S21+ device. The issue appears exclusively in the internal test and Play Store release, while iOS functions flawlessly on development and production.

App.tsx

Amplify.configure(awsconfig as ResourcesConfig);

useEffect(() => {
Amplify.configure(awsconfig as ResourcesConfig);
    const unsubscribe = Hub.listen('auth', async ({payload}) => {
      switch (payload.event) {
        case 'signInWithRedirect': {
          await getUser();

          break;
        }
        }
    });

    return unsubscribe;
  }, [getUser]);

[OtayNacef]

@cwomack added a toast inside hub.listen https://github.com/aws-amplify/amplify-js/assets/46994974/0b061812-af41-4221-839c-0aca534f354c

[OtayNacef]

The problem can be fixed by making sure Hub.listen is set up right in the same part of your code where you handle logins, especially for handling signInWithRedirect events.

[gokaten-token]

@OtayNacef We are experiencing the same issue. The first login attemp won't trigger the signInWithRedirect event, while the second attempt does. Would you please share your solution to this problem? Our code is very simple as below:

Amplify.configure(amplifyconfig);

export const App = () => {
  useEffect(() => {
    const unsubscribe = Hub.listen('auth', async ({payload}) => {
      switch (payload.event) {
        case 'signInWithRedirect':
          Alert.alert('success', 'signInWithRedirect');
          break;
      }
    });
    return unsubscribe;
  }, []);

  return (
    <SafeAreaProvider>
      <ThemeProvider theme={theme}>
        <GestureHandlerRootView style={{flex: 1}}>
          <LoginScreen />
        </GestureHandlerRootView>
      </ThemeProvider>
    </SafeAreaProvider>
  );
};

LoginScreen only contains a button which triggers signInWithRedirect({provider: 'Google'});

@cwomack We reproduced this issue on Pixel3 and Redmi Note 10T in production mode. Package versions are:

"@aws-amplify/react-native": "^1.1.1",
"@aws-amplify/rtn-web-browser": "^1.0.30",
"aws-amplify": "^6.3.4"

[OtayNacef]

@gokaten-token

try {
  await signInWithRedirect(signInInput);
  // TODO : TEMP FIX ANDROID BUG Amplify first signin redirect
  if (IS_ANDROID && !__DEV__)
    setTimeout(async () => {
      await signInWithRedirect(signInInput);
    }, 1000);

} catch (error) {

[cwomack]

Updated this issue to be a bug as we have reproduced it on our side and believe it is related to #13443. Thank you @OtayNacef and @gokaten-token for the additional context!

[OtayNacef]

@cwomack Thanks for the update! We'll keep an eye on issue for any progress. Appreciate the coordination and effort.