SignIn call gave error - AuthUserPoolException: Auth UserPool not configured. #13135

aoneahsan · 2024-03-17T13:07:15Z

Before opening, please confirm:

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

JavaScript Framework

React

Amplify APIs

Authentication

Amplify Version

v6

Amplify Categories

No response

Backend

None

Environment information

React Typescript App.

Describe the bug

using @aws-amplify package in reactjs app

tried signUp, confirmSignUp both function calls works fine

when trying to hit "signIn" function it's giving this error

Expected behavior

should work, as it worked with "aws-amplify/auth".

same code in "aws-amplify/auth" works, while that same code when I use "@aws-amplify/auth" package gives error.

Reproduction steps

install both "aws-amplify" and "@aws-amplify/core" + "@aws-amplify/auth" package
do the setup and configuration
signup works fine, confirm signup works fine, but when signing function get called, it gives error.
same code when I use with "aws-amplify" package works fine

Code Snippet

AWS Amplify Config file "@aws-amplify/core"

import envs from '@/utils/envKeys';
import { Amplify } from '@aws-amplify/core';

Amplify.configure({
  Auth: {
    Cognito: {
      //  Amazon Cognito User Pool ID
      userPoolId: envs.aws.cognito.poolId,
      // OPTIONAL - Amazon Cognito Web Client ID (26-char alphanumeric string)
      userPoolClientId: envs.aws.cognito.clientId,
      // REQUIRED only for Federated Authentication - Amazon Cognito Identity Pool ID
      identityPoolId: '',
      // OPTIONAL - Set to true to use your identity pool's unauthenticated role when user is not logged in
      allowGuestAccess: true,
      // OPTIONAL - This is used when autoSignIn is enabled for Auth.signUp
      signUpVerificationMethod: 'code', // 'code' | 'link'
      passwordFormat: {
        minLength: 8,
        requireLowercase: true,
        requireUppercase: true,
        requireNumbers: true,
        requireSpecialCharacters: true
      },
      userAttributes: {
        email: {
          required: true
        }
      },
      loginWith: {
        username: true
      }
    }
  }
});





AWS Amplify config  "aws-amplify" package

import envs from '@/utils/envKeys';
import { Amplify } from 'aws-amplify';

Amplify.configure({
  Auth: {
    Cognito: {
      //  Amazon Cognito User Pool ID
      userPoolId: envs.aws.cognito.poolId,
      // OPTIONAL - Amazon Cognito Web Client ID (26-char alphanumeric string)
      userPoolClientId: envs.aws.cognito.clientId,
      // REQUIRED only for Federated Authentication - Amazon Cognito Identity Pool ID
      identityPoolId: '',
      // OPTIONAL - Set to true to use your identity pool's unauthenticated role when user is not logged in
      allowGuestAccess: true,
      // OPTIONAL - This is used when autoSignIn is enabled for Auth.signUp
      signUpVerificationMethod: 'code', // 'code' | 'link'
      passwordFormat: {
        minLength: 8,
        requireLowercase: true,
        requireUppercase: true,
        requireNumbers: true,
        requireSpecialCharacters: true
      },
      userAttributes: {
        email: {
          required: true
        }
      },
      loginWith: {
        username: true
      }
    }
  }
});








component code  "@aws-amplify/auth" package

import { ZIonButton } from '@/components/ZIonComponents';
import React from 'react';
import {
  confirmSignUp,
  signUp,
  resendSignUpCode,
  autoSignIn,
  signIn
} from '@aws-amplify/auth';
import { Device } from '@capacitor/device';
import { Preferences } from '@capacitor/preferences';
import {
  IonCard,
  IonCol,
  IonGrid,
  IonRow,
  IonTitle,
  useIonLoading
} from '@ionic/react';

const AWSAmplifyTestPage: React.FC = () => {
  const [authState, setAuthState] = React.useState<string>('');
  const [processingIonLoading, dismissIonLoading] = useIonLoading();
  console.log({ authState, setAuthState });

  const getDeviceInfo = async () => {
    const deviceId = await Device.getId();
    const deviceInfo = await Device.getInfo();
    return { deviceId, deviceInfo };
  };

  const saveUserInfoInLocalStorageInArray = async (userInfo: unknown) => {
    const _res = await Preferences.get({ key: 'userInfoArray' });
    const userInfoArray = JSON.parse(_res.value ?? '[]');
    userInfoArray.push(userInfo);
    await Preferences.set({
      key: 'userInfoArray',
      value: JSON.stringify(userInfoArray)
    });

    console.log({ userInfo });
  };

  const signUpHandler = async (
    username: string,
    email: string,
    password: string,
    autoSignIn = false
  ) => {
    await processingIonLoading('Signing Up...');
    await saveUserInfoInLocalStorageInArray({
      username,
      email,
      password,
      time: new Date()
    });

    const { deviceId, deviceInfo } = await getDeviceInfo();

    try {
      const user = await signUp({
        username,
        password,
        options: {
          userAttributes: {
            email
          },
          autoSignIn,
          clientMetadata: {
            deviceId: deviceId.identifier,
            deviceInfo: JSON.stringify(deviceInfo)
          }
        }
      });
      console.log({ ml: 'AWSAmplifyTestPage -> signUpHandler -> res: ', user });

      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> signUpHandler -> error signing up:',
        error
      );

      await dismissIonLoading();
    }
  };

  const confirmSignUpHandler = async (username: string, code: string) => {
    await processingIonLoading('Confirming Sign Up...');
    try {
      const confirmSignUpRes = await confirmSignUp({
        confirmationCode: code,
        username,
        options: {
          forceAliasCreation: false
        }
      });
      console.log(
        'AWSAmplifyTestPage -> confirmSignUpHandler -> confirmSignUpRes: ',
        confirmSignUpRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> confirmSignUpHandler -> error confirming sign up:',
        error
      );
      await dismissIonLoading();
    }
  };

  const requestNewConfirmationCodeHandler = async (username: string) => {
    await processingIonLoading('Requesting New Confirmation Code...');
    try {
      const requestNewConfirmationCodeRes = await resendSignUpCode({
        username
      });
      console.log(
        'AWSAmplifyTestPage -> requestNewConfirmationCodeHandler -> requestNewConfirmationCodeRes: ',
        requestNewConfirmationCodeRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> requestNewConfirmationCodeHandler -> error requesting new confirmation code:',
        error
      );
      await dismissIonLoading();
    }
  };

  const autoSignInHandler = async () => {
    await processingIonLoading('Auto Signing In...');
    try {
      const autoSignInRes = await autoSignIn();
      console.log(
        'AWSAmplifyTestPage -> autoSignInHandler -> autoSignInRes: ',
        autoSignInRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> autoSignInHandler -> error auto signing in:',
        error
      );
      await dismissIonLoading();
    }
  };

  const signInHandler = async (username: string, password: string) => {
    await processingIonLoading('Signing In...');
    try {
      const { deviceId, deviceInfo } = await getDeviceInfo();
      const signInRes = await signIn({
        username,
        password,
        options: {
          clientMetadata: {
            deviceId: deviceId.identifier,
            deviceInfo: JSON.stringify(deviceInfo)
          }
        }
      });
      console.log(
        'AWSAmplifyTestPage -> signInHandler -> signInRes: ',
        signInRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> signInHandler -> error signing in:',
        error
      );
      await dismissIonLoading();
    }
  };

  return (
    <>
      <IonGrid>
        <IonRow>
          {/* Sign Up Test */}
          <IonCol size='4'>
            <IonCard className='text-center ion-padding'>
              <IonTitle>Sign Up Test</IonTitle>
              <ZIonButton
                onClick={() => {
                  void signUpHandler(
                    `testuser${Math.round(Math.random() * 1000)}`,
                    `testUser${Math.round(Math.random() * 1000)}@yopmail.com`,
                    'testUser@123'
                  );
                }}
              >
                Sign Up - Auto Signin False
              </ZIonButton>
              <ZIonButton
                onClick={() => {
                  void signUpHandler(
                    `testuser${Math.round(Math.random() * 1000)}`,
                    `testUser${Math.round(Math.random() * 1000)}@yopmail.com`,
                    'testUser@123',
                    true
                  );
                }}
              >
                Sign Up - Auto Signin True
              </ZIonButton>
            </IonCard>
          </IonCol>

          {/* Confirm Sign Up Test */}
          <IonCol size='4'>
            <IonCard className='text-center ion-padding'>
              <IonTitle>Confirm Sign Up User Test</IonTitle>
              <ZIonButton
                onClick={() => {
                  const email = prompt('Enter your email');
                  const code = prompt('Enter the code sent to your email');

                  if (!!email && !!code) {
                    void confirmSignUpHandler(email, code);
                  }
                }}
              >
                Confirm Sign Up User Test
              </ZIonButton>
            </IonCard>
          </IonCol>

          {/* Request New Confirmation Code */}
          <IonCol size='4'>
            <IonCard className='text-center ion-padding'>
              <IonTitle>Request New Confirmation Code Test</IonTitle>
              <ZIonButton
                onClick={() => {
                  const email = prompt('Enter your email');

                  if (!!email) {
                    void requestNewConfirmationCodeHandler(email);
                  } else {
                    alert('Please enter your email');
                  }
                }}
              >
                Request New Confirmation Code
              </ZIonButton>
            </IonCard>
          </IonCol>

          {/* Auto Sign In Test */}
          <IonCol size='4'>
            <IonCard className='text-center ion-padding'>
              <IonTitle>Auto Sign In Test</IonTitle>
              <ZIonButton
                onClick={() => {
                  void autoSignInHandler();
                }}
              >
                Auto Sign In - this will only work if autoSignIn was true
              </ZIonButton>
            </IonCard>
          </IonCol>

          {/* Sign In Test */}
          <IonCol size='4'>
            <IonCard className='text-center ion-padding'>
              <IonTitle>Sign In Test</IonTitle>
              <ZIonButton
                onClick={() => {
                  const username = prompt('Enter your username/email');
                  const password = prompt('Enter your password');

                  if (!!username && !!password) {
                    void signInHandler(username, password);
                  } else {
                    alert('Please enter your username and password');
                  }
                }}
              >
                Sign In
              </ZIonButton>
            </IonCard>
          </IonCol>

          {/* Confirm Sign Up Test */}
          <IonCol size='4'>
            <IonCard className='text-center ion-padding'>
              <IonTitle>Get Current Session Test</IonTitle>
              <ZIonButton
                onClick={() => {
                  console.log('Get Current Session');
                }}
              >
                Get Current Session
              </ZIonButton>
            </IonCard>
          </IonCol>
        </IonRow>
      </IonGrid>
    </>
  );
};

export default AWSAmplifyTestPage;












same code, just with more methods, as they were working, with "aws-amplify" package


import { ZIonButton } from '@/components/ZIonComponents';
import React, { useLayoutEffect } from 'react';
import { Amplify } from 'aws-amplify';
import {
  confirmSignUp,
  signUp,
  resendSignUpCode,
  autoSignIn,
  signIn,
  getCurrentUser,
  type AuthUser,
  signOut,
  fetchUserAttributes,
  updateUserAttribute,
  updateUserAttributes,
  deleteUserAttributes,
  deleteUser,
  resetPassword,
  confirmResetPassword
} from 'aws-amplify/auth';
import { Device } from '@capacitor/device';
import { Preferences } from '@capacitor/preferences';
import {
  IonCard,
  IonChip,
  IonCol,
  IonContent,
  IonGrid,
  IonPage,
  IonRow,
  IonTitle,
  useIonLoading
} from '@ionic/react';

const AWSAmplifyTestPage: React.FC = () => {
  const [authState, setAuthState] = React.useState<AuthUser | null>(null);
  const [processingIonLoading, dismissIonLoading] = useIonLoading();

  useLayoutEffect(() => {
    void (async () => {
      const _res = await getCurrentUserHandler();

      setAuthState(_res);
    })();

    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

  const logAwsConfig = () => {
    const awsAmplifyConfig = Amplify.getConfig();

    console.log({ awsAmplifyConfig });
  };

  const getDeviceInfo = async () => {
    const deviceId = await Device.getId();
    const deviceInfo = await Device.getInfo();
    return { deviceId, deviceInfo };
  };

  const saveUserInfoInLocalStorageInArray = async (userInfo: unknown) => {
    const _res = await Preferences.get({ key: 'userInfoArray' });
    const userInfoArray = JSON.parse(_res.value ?? '[]');
    userInfoArray.push(userInfo);
    await Preferences.set({
      key: 'userInfoArray',
      value: JSON.stringify(userInfoArray)
    });

    console.log({ userInfo });
  };

  const signUpHandler = async (
    username: string,
    email: string,
    password: string,
    autoSignIn = false
  ) => {
    await processingIonLoading('Signing Up...');
    await saveUserInfoInLocalStorageInArray({
      username,
      email,
      password,
      time: new Date()
    });

    const { deviceId, deviceInfo } = await getDeviceInfo();

    try {
      const user = await signUp({
        username,
        password,
        options: {
          userAttributes: {
            email
          },
          autoSignIn,
          clientMetadata: {
            deviceId: deviceId.identifier,
            deviceInfo: JSON.stringify(deviceInfo)
          }
        }
      });
      console.log({ ml: 'AWSAmplifyTestPage -> signUpHandler -> res: ', user });

      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> signUpHandler -> error signing up:',
        error
      );

      await dismissIonLoading();
    }
  };

  const confirmSignUpHandler = async (username: string, code: string) => {
    await processingIonLoading('Confirming Sign Up...');
    try {
      const confirmSignUpRes = await confirmSignUp({
        confirmationCode: code,
        username,
        options: {
          forceAliasCreation: false
        }
      });
      console.log(
        'AWSAmplifyTestPage -> confirmSignUpHandler -> confirmSignUpRes: ',
        confirmSignUpRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> confirmSignUpHandler -> error confirming sign up:',
        error
      );
      await dismissIonLoading();
    }
  };

  const requestNewConfirmationCodeHandler = async (username: string) => {
    await processingIonLoading('Requesting New Confirmation Code...');
    try {
      const requestNewConfirmationCodeRes = await resendSignUpCode({
        username
      });
      console.log(
        'AWSAmplifyTestPage -> requestNewConfirmationCodeHandler -> requestNewConfirmationCodeRes: ',
        requestNewConfirmationCodeRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> requestNewConfirmationCodeHandler -> error requesting new confirmation code:',
        error
      );
      await dismissIonLoading();
    }
  };

  const autoSignInHandler = async () => {
    await processingIonLoading('Auto Signing In...');
    try {
      const autoSignInRes = await autoSignIn();
      console.log(
        'AWSAmplifyTestPage -> autoSignInHandler -> autoSignInRes: ',
        autoSignInRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> autoSignInHandler -> error auto signing in:',
        error
      );
      await dismissIonLoading();
    }
  };

  const signInHandler = async (username: string, password: string) => {
    await processingIonLoading('Signing In...');
    try {
      const { deviceId, deviceInfo } = await getDeviceInfo();
      const signInRes = await signIn({
        username,
        password,
        options: {
          clientMetadata: {
            deviceId: deviceId.identifier,
            deviceInfo: JSON.stringify(deviceInfo)
          }
        }
      });
      console.log(
        'AWSAmplifyTestPage -> signInHandler -> signInRes: ',
        signInRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> signInHandler -> error signing in:',
        error
      );
      await dismissIonLoading();
    }
  };

  const getCurrentUserHandler = async () => {
    await processingIonLoading('Getting Current User...');
    try {
      const currentUser = await getCurrentUser();
      console.log(
        'AWSAmplifyTestPage -> getCurrentUserHandler -> currentUser: ',
        currentUser
      );
      await dismissIonLoading();

      return currentUser;
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> getCurrentUserHandler -> error getting current user:',
        error
      );
      await dismissIonLoading();

      return null;
    }
  };

  const logoutHandler = async () => {
    await processingIonLoading('Logging Out...');
    try {
      await signOut({
        global: true
      });
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> logoutHandler -> error logging out:',
        error
      );
      await dismissIonLoading();
    }
  };

  const fetchUserAttributesHandler = async () => {
    await processingIonLoading('Fetching User Attributes...');
    try {
      const userAttributes = await fetchUserAttributes();
      console.log(
        'AWSAmplifyTestPage -> fetchUserAttributesHandler -> userAttributes: ',
        userAttributes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> fetchUserAttributesHandler -> error fetching user attributes:',
        error
      );
      await dismissIonLoading();
    }
  };

  const updateUserAttributeHandler = async () => {
    await processingIonLoading('Updating User Attribute...');
    try {
      const updateUserAttributeRes = await updateUserAttribute({
        userAttribute: {
          attributeKey: 'given_name',
          value: 'Given Name Changed'
        }
      });
      console.log(
        'AWSAmplifyTestPage -> updateUserAttributeHandler -> updateUserAttributeRes: ',
        updateUserAttributeRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> updateUserAttributeHandler -> error updating user attribute:',
        error
      );
      await dismissIonLoading();
    }
  };

  const updateUserAttributesHandler = async () => {
    await processingIonLoading('Updating User Attributes...');
    try {
      const updateUserAttributesRes = await updateUserAttributes({
        userAttributes: {
          address: 'lahore pakistan',
          birthdate: '1999-05-03',
          family_name: 'Mahmood',
          gender: 'Male',
          given_name: 'Ahsan',
          locale: 'ur',
          middle_name: 'Tariq',
          name: 'Ahsan Mahmood',
          nickname: 'Aoneahsan',
          phone_number: '+923046619706',
          picture: 'https://github.com/aoneahsan.png',
          preferred_username: 'aoneahsan_preferred_username',
          // phone_number_verified: 'true',
          profile: 'https://aoneahsan.com/linkedin',
          website: 'https://aoneahsan.com',
          // updated_at: new Date().toString(),
          zoneinfo: 'Asia/Karachi'
          // sub: 'aoneahsan_sub'
        }
      });
      console.log(
        'AWSAmplifyTestPage -> updateUserAttributesHandler -> updateUserAttributesRes: ',
        updateUserAttributesRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> updateUserAttributesHandler -> error updating user attributes:',
        error
      );
      await dismissIonLoading();
    }
  };

  const deleteUserAttributesHandler = async () => {
    await processingIonLoading('Deleting User Attributes...');
    try {
      await deleteUserAttributes({
        userAttributeKeys: ['given_name']
      });
      console.log(
        'AWSAmplifyTestPage -> deleteUserAttributesHandler -> deleteUserAttributesRes: '
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> deleteUserAttributesHandler -> error deleting user attributes:',
        error
      );
      await dismissIonLoading();
    }
  };

  const deleteUserHandler = async () => {
    await processingIonLoading('Deleting User...');
    try {
      await deleteUser();
      console.log('AWSAmplifyTestPage -> deleteUserHandler -> deleteUserRes: ');
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> deleteUserHandler -> error deleting user:',
        error
      );
      await dismissIonLoading();
    }
  };

  const resetPasswordHandler = async (username: string) => {
    await processingIonLoading('Resetting Password...');
    try {
      const resetPasswordRes = await resetPassword({
        username
      });
      console.log(
        'AWSAmplifyTestPage -> resetPasswordHandler -> resetPasswordRes: ',
        resetPasswordRes
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> resetPasswordHandler -> error resetting password:',
        error
      );
      await dismissIonLoading();
    }
  };

  const confirmResetPasswordHandler = async (
    username: string,
    code: string,
    newPassword: string
  ) => {
    await processingIonLoading('Confirming Reset Password...');
    try {
      await confirmResetPassword({
        confirmationCode: code,
        newPassword,
        username
      });
      console.log(
        'AWSAmplifyTestPage -> confirmResetPasswordHandler -> confirmResetPasswordRes: '
      );
      await dismissIonLoading();
    } catch (error) {
      console.error(
        'AWSAmplifyTestPage -> confirmResetPasswordHandler -> error confirming reset password:',
        error
      );
      await dismissIonLoading();
    }
  };

  return (
    <>
      <IonPage>
        <IonContent>
          <IonGrid>
            <IonRow>
              {/* User Current Auth State Test */}
              <IonCol size='12'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>User Current Auth State Test</IonTitle>

                  <IonChip color={authState ? 'success' : 'danger'}>
                    {authState ? authState.username : 'Not Logged '}

                    {authState ? (
                      <>
                        <br />
                        <br />
                        {JSON.stringify(authState, null, 2)}
                      </>
                    ) : (
                      ''
                    )}
                  </IonChip>
                </IonCard>
              </IonCol>

              {/* Sign Up Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Sign Up Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void signUpHandler(
                        `testuser${Math.round(Math.random() * 1000)}`,
                        `testUser${Math.round(Math.random() * 1000)}@yopmail.com`,
                        'testUser@123'
                      );
                    }}
                  >
                    Sign Up - Auto Signin False
                  </ZIonButton>
                  <ZIonButton
                    onClick={() => {
                      void signUpHandler(
                        `testuser${Math.round(Math.random() * 1000)}`,
                        `testUser${Math.round(Math.random() * 1000)}@yopmail.com`,
                        'testUser@123',
                        true
                      );
                    }}
                  >
                    Sign Up - Auto Signin True
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Confirm Sign Up Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Confirm Sign Up User Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      const email = prompt('Enter your email');
                      const code = prompt('Enter the code sent to your email');

                      if (!!email && !!code) {
                        void confirmSignUpHandler(email, code);
                      }
                    }}
                  >
                    Confirm Sign Up User Test
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Request New Confirmation Code */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Request New Confirmation Code Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      const email = prompt('Enter your email');

                      if (!!email) {
                        void requestNewConfirmationCodeHandler(email);
                      } else {
                        alert('Please enter your email');
                      }
                    }}
                  >
                    Request New Confirmation Code
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Auto Sign In Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Auto Sign In Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void autoSignInHandler();
                    }}
                  >
                    Auto Sign In - this will only work if autoSignIn was true
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Sign In Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Sign In Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      const username = prompt('Enter your username/email');
                      const password = 'testUser@123';

                      if (!!username) {
                        void signInHandler(username, password);
                      } else {
                        alert('Please enter your username and password');
                      }
                    }}
                  >
                    Sign In with default password
                  </ZIonButton>
                  <ZIonButton
                    onClick={() => {
                      const username = prompt('Enter your username/email');
                      const password = prompt('Enter your password');

                      if (!!username && !!password) {
                        void signInHandler(username, password);
                      } else {
                        alert('Please enter your username and password');
                      }
                    }}
                  >
                    Sign In with custom password
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* logAwsConfig Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>logAwsConfig Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      logAwsConfig();
                    }}
                  >
                    logAwsConfig
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Get Current User Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Get Current User Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void getCurrentUserHandler();
                    }}
                  >
                    Get Current User
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Logout Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Logout Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void logoutHandler();
                    }}
                  >
                    Logout
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Fetch User Attributes Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Fetch User Attributes Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void fetchUserAttributesHandler();
                    }}
                  >
                    Fetch User Attributes
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Update User Attribute Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Update User Attribute Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void updateUserAttributeHandler();
                    }}
                  >
                    Update User Attribute
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Update User Attributes Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Update User Attributes Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void updateUserAttributesHandler();
                    }}
                  >
                    Update User Attributes
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Delete User Attributes Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Delete User Attributes Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void deleteUserAttributesHandler();
                    }}
                  >
                    Delete User Attributes
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Delete User Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Delete User Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      void deleteUserHandler();
                    }}
                  >
                    Delete User
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Reset Password Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Reset Password Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      const username = prompt('Enter your username');

                      if (!!username) {
                        void resetPasswordHandler(username);
                      } else {
                        alert('Please enter your username');
                      }
                    }}
                  >
                    Reset Password
                  </ZIonButton>
                </IonCard>
              </IonCol>

              {/* Confirm Reset Password Test */}
              <IonCol size='4'>
                <IonCard className='text-center ion-padding'>
                  <IonTitle>Confirm Reset Password Test</IonTitle>
                  <ZIonButton
                    onClick={() => {
                      const username = prompt('Enter your username');
                      const code = prompt('Enter the code sent to your email');
                      const newPassword = prompt('Enter your new password');

                      if (!!username && !!code && !!newPassword) {
                        void confirmResetPasswordHandler(
                          username,
                          code,
                          newPassword
                        );
                      } else {
                        alert(
                          'Please enter your username, code and new password'
                        );
                      }
                    }}
                  >
                    Confirm Reset Password
                  </ZIonButton>
                </IonCard>
              </IonCol>
            </IonRow>
          </IonGrid>
        </IonContent>
      </IonPage>
    </>
  );
};

export default AWSAmplifyTestPage;

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

using @aws-amplify package in reactjs app

tried signUp, confirmSignUp both function calls works fine

when trying to hit "signIn" function it's giving this error

The text was updated successfully, but these errors were encountered:

nadetastic · 2024-03-18T19:49:36Z

HI @aoneahsan thank you for openning this issue. Could you clarify why you are installing both "aws-amplify" and "@aws-amplify/core" + "@aws-amplify/auth" packages? You should only need to install aws-amplify, then import the api's from it.

aoneahsan · 2024-03-18T23:55:03Z

basically i wanted to use

@aws-amplify/core + @aws-amplify/auth

that did not work that's why i had to use this aws-amplify

nadetastic · 2024-03-19T14:30:38Z

@aoneahsan got it. The recommended usage is to import the api's from aws-amplify so it should be working as expected.

Did you have concerns with this? Im looking to understand why you are wanting to use @aws-amplify/core + @aws-amplify/auth - for example are you looking for bundle size improvements?

aoneahsan · 2024-03-19T16:54:14Z

yes, i want to use these packages so it will improve the final bundle size

elorzafe · 2024-03-19T18:53:06Z

@aoneahsan bundle size should not be a problem because the library supports tree shaking capabilities, if you are using a modern bundler (like webpack) it should only include the part of the library you are importing.

aoneahsan · 2024-03-19T23:49:24Z

okay, but let's focus on why it's giving error when tried with @aws-amplify/auth package?

HuiSF · 2024-03-21T00:54:36Z

You are importing modules from different packages, which may lead to receive different instances of the Amplify object, which may not be fully configured.

In particular, if you call the .configure() method on the Amplify instance imported directly from @aws-amplify/core, the underlying auth providers won't be created, hence it will throw the error you have encountered. Please use the umbrella package (aws-amplify) and avoid using the @aws-amplfiy namespaced package unless the documentation provides instructions to do so.

cwomack · 2024-03-26T20:27:03Z

@aoneahsan, have you had a chance to review the above comments? Just want to check in and see if there are still any concerns at this point. Thanks.

aoneahsan · 2024-03-26T23:40:00Z

I'm using "aws-amplify" package right now and it's working.

but i want to know how to use "@aws-amplify" packages properly

please do share any official resource example showing the process

cwomack · 2024-03-28T19:02:58Z

@aoneahsan, we don't have any resources to share on this because we don't recommend this (as @HuiSF mentioned above). However, this would be the list of categories within Amplify that would utilize the @aws-amplify pattern if you're looking to improve the installation size:

geo
interactions
predictions
pubsub
adapter-nextjs
datastore-storage-adapter

ShadowOfLies · 2024-03-30T11:13:02Z

Ran into this same issue during migration from v5 to v6 and I guess my use case is similar to that of @aoneahsan. i.e. Using a pre-existing AWS Cognito instance for auth with the least amount of configuration and reliance on Amplify.

I can confirm that using only the aws-amplify package in the dependency management and replacing

import { Amplify, AuthUserPoolConfig, ResourcesConfig } from '@aws-amplify/core';

with

import { AuthUserPoolConfig, ResourcesConfig } from '@aws-amplify/core';
import { Amplify } from 'aws-amplify';

worked exactly as described above (i.e. avoiding partially configured providers) and did not significantly affect the bundle size, even with development generated bundles.

cwomack · 2024-04-04T13:58:43Z

It looks like we can call this issue resolved then at this point. If anyone following this still has questions or experiencing a further blocker tied to this, feel free to reply back and we can reopen.

natuan62 · 2024-05-20T02:52:23Z

I have same problem if use @aws-amplify/auth and @aws-amplify/core like

import { fetchAuthSession } from '@aws-amplify/auth';
import { Amplify, ResourcesConfig } from '@aws-amplify/core';

If only use aws-amplify package, it works fine

import { fetchAuthSession } from 'aws-amplify/auth';
import { Amplify, ResourcesConfig } from 'aws-amplify';
import awsconfig from '@/aws-exports';

  const libraryOptions = {
    API: {
      GraphQL: {
        headers: async () => ({
          Authorization: (await fetchAuthSession()).tokens?.idToken?.toString() as string,
        }),
      },
    },
  };
  Amplify.configure(awsconfig, libraryOptions);

@ShadowOfLies thanks for your confirm.

aoneahsan added the pending-triage Issue is pending triage label Mar 17, 2024

cwomack added the Auth Related to Auth components/category label Mar 18, 2024

cwomack self-assigned this Mar 18, 2024

nadetastic added the pending-response Issue is pending response from the issue requestor label Mar 18, 2024

github-actions bot removed the pending-response Issue is pending response from the issue requestor label Mar 18, 2024

nadetastic added question General question pending-response Issue is pending response from the issue requestor and removed pending-triage Issue is pending triage labels Mar 19, 2024

nadetastic self-assigned this Mar 19, 2024

github-actions bot removed the pending-response Issue is pending response from the issue requestor label Mar 19, 2024

cwomack added the pending-response Issue is pending response from the issue requestor label Mar 19, 2024

github-actions bot removed the pending-response Issue is pending response from the issue requestor label Mar 19, 2024

nadetastic added the pending-response Issue is pending response from the issue requestor label Mar 21, 2024

github-actions bot removed the pending-response Issue is pending response from the issue requestor label Mar 26, 2024

cwomack added the pending-response Issue is pending response from the issue requestor label Mar 28, 2024

nadetastic removed their assignment Mar 29, 2024

cwomack closed this as completed Apr 4, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

SignIn call gave error - AuthUserPoolException: Auth UserPool not configured. #13135

SignIn call gave error - AuthUserPoolException: Auth UserPool not configured. #13135

aoneahsan commented Mar 17, 2024

nadetastic commented Mar 18, 2024

aoneahsan commented Mar 18, 2024

nadetastic commented Mar 19, 2024

aoneahsan commented Mar 19, 2024

elorzafe commented Mar 19, 2024

aoneahsan commented Mar 19, 2024

HuiSF commented Mar 21, 2024

cwomack commented Mar 26, 2024

aoneahsan commented Mar 26, 2024

cwomack commented Mar 28, 2024

ShadowOfLies commented Mar 30, 2024 •

edited

cwomack commented Apr 4, 2024

natuan62 commented May 20, 2024 •

edited

SignIn call gave error - AuthUserPoolException: Auth UserPool not configured. #13135

SignIn call gave error - AuthUserPoolException: Auth UserPool not configured. #13135

Comments

aoneahsan commented Mar 17, 2024

Before opening, please confirm:

JavaScript Framework

Amplify APIs

Amplify Version

Amplify Categories

Backend

Environment information

Describe the bug

Expected behavior

Reproduction steps

Code Snippet

Log output

aws-exports.js

Manual configuration

Additional configuration

Mobile Device

Mobile Operating System

Mobile Browser

Mobile Browser Version

Additional information and screenshots

nadetastic commented Mar 18, 2024

aoneahsan commented Mar 18, 2024

nadetastic commented Mar 19, 2024

aoneahsan commented Mar 19, 2024

elorzafe commented Mar 19, 2024

aoneahsan commented Mar 19, 2024

HuiSF commented Mar 21, 2024

cwomack commented Mar 26, 2024

aoneahsan commented Mar 26, 2024

cwomack commented Mar 28, 2024

ShadowOfLies commented Mar 30, 2024 • edited

cwomack commented Apr 4, 2024

natuan62 commented May 20, 2024 • edited

ShadowOfLies commented Mar 30, 2024 •

edited

natuan62 commented May 20, 2024 •

edited