Can not sign in

[RyugaRyuzaki]

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

I can not signin in typescript with

 const {isSignedIn, nextStep} = await signIn({
        username: email,
        password,
        options: {
          userAttributes: {
            email: email,
          },
        },
      });

Even i can resetpassword and confim

 const {nextStep} = (await resetPassword({
        username: email,
      })) as ResetPasswordOutput;

      switch (nextStep.resetPasswordStep) {
        case "CONFIRM_RESET_PASSWORD_WITH_CODE":
          navigate("/newpassword");
          break;
        case "DONE":
          console.log("Successfully reset password.");
          break;
      }

   const output = await confirmResetPassword({
        username: email,
        confirmationCode,
        newPassword,
      });

And my user also received verify code.

Describe the bug

Can not signin

Expected behavior

Need user signiin

Reproduction steps

/////private

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

[jjarvisp]

Hey @RyugaRyuzaki, thanks for opening this issue. What is the output of the signIn API call? If you have MFA enabled on your user pool you will need to call confirmSignIn with the OTP code received as outlined in the documentation here.

[RyugaRyuzaki]

Hey @RyugaRyuzaki, thanks for opening this issue. What is the output of the signIn API call? If you have MFA enabled on your user pool you will need to call confirmSignIn with the OTP code received as outlined in the documentation here.

Hi @jjarvisp i tried this example

interface SignInFormElements extends HTMLFormControlsCollection {
  email: HTMLInputElement
  password: HTMLInputElement
}

interface SignInForm extends HTMLFormElement {
  readonly elements: SignInFormElements
}

export default function App() {
  async function handleSubmit(event: FormEvent<SignInForm>) {
    event.preventDefault()
    const form = event.currentTarget
    // ... validate inputs
    await signIn({
      username: form.elements.email.value,
      password: form.elements.password.value,
    })
  }

  return (
    <form onSubmit={handleSubmit}>
      <label htmlFor="email">Email:</label>
      <input type="text" id="email" name="email" />
      <label htmlFor="password">Password:</label>
      <input type="password" id="password" name="password" />
      <input type="submit" />
    </form>
  )
}

But the error "Incorrect username or password"
Then i resetPassword, and new password after that still error.

[jjarvisp]

Hi, @RyugaRyuzaki, thanks for following up. I have a few more questions that will hopefully help us narrow down the friction your are encountering here.

Can you verify that the values of username and password match as well and also confirm by inspecting the network traffic that the username and password in the request matches what you would expect for an existing user in your Cognito user pool?

For example:

  async function handleSubmit(event: FormEvent<SignInForm>) {
    event.preventDefault()
    const form = event.currentTarget
    const signInInput = {
      username: form.elements.email.value,
      password: form.elements.password.value,
    };
    console.log(signInInput);
    const { nextStep } = await signIn(signInInput);
    console.log(nextStep);
  }

Do you have MFA enabled in your Cognito user pool? If so, you'll need to update your application to handle collecting the OTP code from the user and calling the confirmSignIn API. Here's some documentation related to the multi-step sign-in flow.

Can you run the following and share the output?

npx envinfo --system --binaries --browsers --npmPackages --duplicates --npmGlobalPackages