Ampliy-Auth V6, How to get ChallengeParameters to show back to user in UI

[hanoj-budime]

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

Amplify APIs

Authentication

Amplify Categories

auth

Environment information

# Put output below this line
  System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 AMD Ryzen 5 PRO 4650U with Radeon Graphics
    Memory: 6.00 GB / 15.23 GB
  Binaries:
    Node: 18.19.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.21 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 10.2.3 - ~\node_modules\.bin\npm.CMD
  Browsers:
    Edge: Chromium (120.0.2210.91)
    Internet Explorer: 11.0.19041.3636
  npmGlobalPackages:
    @angular/cli: 13.3.0
    @aws-amplify/cli: 10.4.1
    @cyclonedx/cyclonedx-npm: 1.6.1
    aws-sdk-js-codemod: 0.14.0
    create-react-app: 5.0.1
    http-server: 14.1.1
    jest: 27.5.1
    newman: 5.3.2
    node-prune: 1.0.2
    nodemon: 2.0.20
    npm: 9.6.3
    nx: 16.7.4
    rimraf: 5.0.5
    rollup: 3.7.5
    yarn: 1.22.21

Describe the bug

Where to get these values "CODE_DELIVERY_DESTINATION" or "FRIENDLY_DEVICE_NAME" With Latest version of Auth V6

We are not able to get CODE_DELIVERY_DESTINATION FRIENDLY_DEVICE_NAME

To showcase to user - based-on choose MFA option to Auth

Expected behavior

Expected behavior is we want show to user, their ChallengeParameters based-on option selected. CODE_DELIVERY_DESTINATION FRIENDLY_DEVICE_NAME

Reproduction steps

1. install auth 6v
2. sign-in with MFA
3. enable totp to user
4. now, try to sign-in with MFA this time you'll not-able to show ChallengeParameters to display in UI

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

[nadetastic]

HI @HanojHanu thank you for opening this issue. Can you clarify how the user is signing in? The screenshots you shared seem to be the Hosted UI. Im assuming that you want the same behavior when calling signIn()? As a note, the signIn function returns an out put that contains a next step and context on that next step. You should be able to get the values you need from that.

• https://docs.amplify.aws/react/build-a-backend/auth/enable-sign-up/#sign-in
• https://docs.amplify.aws/react/build-a-backend/auth/manage-mfa/#update-the-current-users-mfa-preferences

The second link above also shows an example of how to handle MFA next steps in you app.

[hanoj-budime]

@nadetastic, I've included screenshots here to illustrate reference examples, showcasing features from the hosted UI. It's worth noting that we implement the Amplify Auth npm package within our React.js application.

[hanoj-budime]

Im assuming that you want the same behavior when calling signIn()? As a note, the signIn function returns an out put that contains a next step and context on that next step. You should be able to get the values you need from that. https://docs.amplify.aws/react/build-a-backend/auth/enable-sign-up/#sign-in https://docs.amplify.aws/react/build-a-backend/auth/manage-mfa/#update-the-current-users-mfa-preferences The second link above also shows an example of how to handle MFA next steps in you app.

The Amplify sign-in process currently does not return the expected values, specifically 'challengeParameters,' as evidenced by the network log. Despite the presence of this information in the log, it is not being received as part of the sign-in response. Further investigation is required to address this discrepancy.

[nadetastic]

@HanojHanu you should be able to access the DESTINATION from the return out put of sign in like this:

const result: SignInOutPut = await signIn({username,password})

// For SMS MFA
const destination = result.nextStep.codeDeliveryDetails.destination;

Could you try this? Or try to console log the result object that is returned by signIn()?

For friendly device name, let me confirm the behavior with the team and will follow up.

[hanoj-budime]

[hanoj-budime]

@nadetastic

[oliverjohns]

Im experiencing the same problem, aws-amplify v6 does not seem to include this CODE_DELIVERY_DESTINATION nor the CODE_DELIVERY_DELIVERY_MEDIUM .

[hanoj-budime]

@cwomack and @nadetastic, any updates here ?

[nadetastic]

@HanojHanu Im still unable to reproduce this issue on my end. After I have created a user and setup SMS MFA, I call signIn() and this is the response I get when I console.log the result of signIn()

const result = await signIn({username,password});

console.log('signIn result: ',result):
signIn result: {
    isSignedIn: false,
    nextStep: {
        codeDeliveryDetails: {
            deliveryMedium: "SMS",
            destination: "+*******1234"
        },
        signInStep: "CONFIRM_SIGN_IN_WITH_SMS_CODE"
    }
}

Is there any additional context you can provide here? For example, how did you create you Cognito resources, or more information about how you MFA configuration is done, such as Is it optional or required?

[cwomack]

Hey, @HanojHanu are you still experiencing this issue? Don't know if you had a chance to look at @nadetastic's comment above and example code snippet, but let us know if you're blocked by this.

[nadetastic]

@HanojHanu following up here - going to mark this issue as closed for now. If you are still facing issues or have questions please let me know and I'll be happy to help.

[hanoj-budime]

@nadetastic, Yes we're still facing that same issue..

[hanoj-budime]

@nadetastic, can you check with your team is this changes supported or not ?

even in in your documention also missing that, Please check @nadetastic & @cwomack.

[hanoj-budime]

@HanojHanu Im still unable to reproduce this issue on my end. After I have created a user and setup SMS MFA, I call signIn() and this is the response I get when I console.log the result of signIn()

const result = await signIn({username,password});

console.log('signIn result: ',result):
signIn result: {
    isSignedIn: false,
    nextStep: {
        codeDeliveryDetails: {
            deliveryMedium: "SMS",
            destination: "+*******1234"
        },
        signInStep: "CONFIRM_SIGN_IN_WITH_SMS_CODE"
    }
}

Is there any additional context you can provide here? For example, how did you create you Cognito resources, or more information about how you MFA configuration is done, such as Is it optional or required?

version ?

[hanoj-budime]

@nadetastic, open this issue. still not working.

Checked with latest version, no luck in getting "FRIENDLY_DEVICE_NAME"

• @cwomack