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.

Sign up for GitHub

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

Jump to bottom

MFA Enable/Disable using setUserMfaPreference doesn't sync with AWS cognito #10011

Closed
3 tasks done
YazhiniGurubaran opened this issue Jun 20, 2022 · 2 comments
Closed
3 tasks done

MFA Enable/Disable using setUserMfaPreference doesn't sync with AWS cognito #10011

YazhiniGurubaran opened this issue Jun 20, 2022 · 2 comments
Assignees
@chrisbonifacio @ahilashsasidharan
Labels
amazon-cognito-identity-js Used for issues related to this specific package within the monorepo Auth Related to Auth components/category bug Something isn't working good first issue Good for newcomers Service Team Issues asked to the Service Team
Projects
MLH Fellows Summer 2022

Comments

@YazhiniGurubaran
Copy link

YazhiniGurubaran commented Jun 20, 2022 •
edited by chrisbonifacio

Before opening, please confirm:

JavaScript Framework

React

Amplify APIs

Not applicable

Amplify Categories

No response

Environment information

System:
    OS: Windows 10 10.0.19044
    CPU: (8) x64 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz
    Memory: 3.22 GB / 15.76 GB
  Binaries:
    Node: 14.15.3 - C:\Program Files\nodejs\node.EXE
    npm: 6.14.9 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (102.0.1245.44)
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    @babel/code-frame: ^7.10.4 => 7.16.7 (7.5.5)
    @babel/core: ^7.3.4 => 7.17.10
    @babel/plugin-proposal-class-properties: ^7.3.4 => 7.16.7
    @babel/plugin-proposal-nullish-coalescing-operator: ^7.10.1 => 7.16.7
    @babel/plugin-proposal-object-rest-spread: ^7.10.1 => 7.17.3
    @babel/plugin-proposal-optional-chaining: ^7.10.1 => 7.16.7
    @babel/preset-env: ^7.10.2 => 7.17.10
    @babel/preset-react: ^7.10.1 => 7.16.7
    @date-io/date-fns: ^1.3.13 => 1.3.13
    @hookform/resolvers: ^0.1.0 => 0.1.1
    @material-ui/core: ^4.11.3 => 4.12.4
    @material-ui/icons: ^4.11.2 => 4.11.3
    @material-ui/lab: ^4.0.0-alpha.57 => 4.0.0-alpha.61
    @material-ui/pickers: ^3.2.10 => 3.3.10
    @storybook/addon-actions: ^5.3.19 => 5.3.21
    @storybook/addon-console: ^1.2.1 => 1.2.3
    @storybook/addon-knobs: ^5.3.19 => 5.3.21
    @storybook/addon-links: ^5.3.19 => 5.3.21
    @storybook/addon-storysource: ^5.3.19 => 5.3.21
    @storybook/addons: ^5.3.19 => 5.3.22 (5.3.21)
    @storybook/react: ^5.3.19 => 5.3.21
    @storybook/theming: ^5.3.19 => 5.3.22 (5.3.21)
    @testing-library/react: ^10.4.3 => 10.4.9
    @wojtekmaj/react-daterange-picker: ^3.1.0 => 3.4.0
    amazon-cognito-identity-js: ^4.5.7 => 4.6.3
    axios: ^0.18.1 => 0.18.1
    babel-eslint: ^10.1.0 => 10.1.0
    babel-jest: ^26.0.1 => 26.6.3
    babel-loader: ^8.0.5 => 8.2.5
    bootstrap: ^4.5.3 => 4.6.1
    copy-webpack-plugin: ^6.0.2 => 6.4.1
    cross-env: ^7.0.2 => 7.0.3
    css-loader: ^2.1.1 => 2.1.1 (3.6.0)
    custom-env: ^2.0.1 => 2.0.1
    date-fns: ^2.16.1 => 2.28.0
    demo:  1.0.1
    eslint: ^5.16.0 => 5.16.0
    eslint-config-airbnb: ^18.2.0 => 18.2.1
    eslint-config-prettier: ^6.11.0 => 6.15.0
    eslint-import-resolver-alias: ^1.1.2 => 1.1.2
    eslint-plugin-import: ^2.22.1 => 2.26.0
    eslint-plugin-jsx-a11y: ^6.3.1 => 6.5.1
    eslint-plugin-react: ^7.21.2 => 7.29.4
    eslint-plugin-react-hooks: ^1.7.0 => 1.7.0
    file-loader: ^6.2.0 => 6.2.0 (4.3.0)
    html-webpack-plugin: ^4.3.0 => 4.5.2
    image-webpack-loader: ^6.0.0 => 6.0.0
    jest: ^26.0.1 => 26.6.3
    jsonwebtoken: ^8.5.1 => 8.5.1
    mini-css-extract-plugin: ^0.7.0 => 0.7.0
    moment: ^2.29.1 => 2.29.3
    node-sass: ^4.14.1 => 4.14.1
    npm-run-all: ^4.1.5 => 4.1.5
    prop-types: ^15.7.2 => 15.8.1
    react: ^16.8.4 => 16.14.0
    react-bootstrap: ^1.4.0 => 1.6.4
    react-bootstrap/AbstractNav:  undefined ()
    react-bootstrap/AbstractNavItem:  undefined ()
    react-bootstrap/Accordion:  undefined ()
    react-bootstrap/AccordionCollapse:  undefined ()
    react-bootstrap/AccordionContext:  undefined ()
    react-bootstrap/AccordionToggle:  undefined ()
    react-bootstrap/Alert:  undefined ()
    react-bootstrap/Badge:  undefined ()
    react-bootstrap/BootstrapModalManager:  undefined ()
    react-bootstrap/Breadcrumb:  undefined ()
    react-bootstrap/BreadcrumbItem:  undefined ()
    react-bootstrap/Button:  undefined ()
    react-bootstrap/ButtonGroup:  undefined ()
    react-bootstrap/ButtonToolbar:  undefined ()
    react-bootstrap/Card:  undefined ()
    react-bootstrap/CardColumns:  undefined ()
    react-bootstrap/CardContext:  undefined ()
    react-bootstrap/CardDeck:  undefined ()
    react-bootstrap/CardGroup:  undefined ()
    react-bootstrap/CardImg:  undefined ()
    react-bootstrap/Carousel:  undefined ()
    react-bootstrap/CarouselCaption:  undefined ()
    react-bootstrap/CarouselItem:  undefined ()
    react-bootstrap/CloseButton:  undefined ()
    react-bootstrap/Col:  undefined ()
    react-bootstrap/Collapse:  undefined ()
    react-bootstrap/Container:  undefined ()
    react-bootstrap/Dropdown:  undefined ()
    react-bootstrap/DropdownButton:  undefined ()
    react-bootstrap/DropdownItem:  undefined ()
    react-bootstrap/DropdownMenu:  undefined ()
    react-bootstrap/DropdownToggle:  undefined ()
    react-bootstrap/ElementChildren:  undefined ()
    react-bootstrap/Fade:  undefined ()
    react-bootstrap/Feedback:  undefined ()
    react-bootstrap/Figure:  undefined ()
    react-bootstrap/FigureCaption:  undefined ()
    react-bootstrap/FigureImage:  undefined ()
    react-bootstrap/Form:  undefined ()
    react-bootstrap/FormCheck:  undefined ()
    react-bootstrap/FormCheckInput:  undefined ()
    react-bootstrap/FormCheckLabel:  undefined ()
    react-bootstrap/FormContext:  undefined ()
    react-bootstrap/FormControl:  undefined ()
    react-bootstrap/FormFile:  undefined ()
    react-bootstrap/FormFileInput:  undefined ()
    react-bootstrap/FormFileLabel:  undefined ()
    react-bootstrap/FormGroup:  undefined ()
    react-bootstrap/FormLabel:  undefined ()
    react-bootstrap/FormText:  undefined ()
    react-bootstrap/Image:  undefined ()
    react-bootstrap/InputGroup:  undefined ()
    react-bootstrap/Jumbotron:  undefined ()
    react-bootstrap/ListGroup:  undefined ()
    react-bootstrap/ListGroupItem:  undefined ()
    react-bootstrap/Media:  undefined ()
    react-bootstrap/Modal:  undefined ()
    react-bootstrap/ModalBody:  undefined ()
    react-bootstrap/ModalContext:  undefined ()
    react-bootstrap/ModalDialog:  undefined ()
    react-bootstrap/ModalFooter:  undefined ()
    react-bootstrap/ModalHeader:  undefined ()
    react-bootstrap/ModalTitle:  undefined ()
    react-bootstrap/Nav:  undefined ()
    react-bootstrap/NavContext:  undefined ()
    react-bootstrap/NavDropdown:  undefined ()
    react-bootstrap/NavItem:  undefined ()
    react-bootstrap/NavLink:  undefined ()
    react-bootstrap/Navbar:  undefined ()
    react-bootstrap/NavbarBrand:  undefined ()
    react-bootstrap/NavbarCollapse:  undefined ()
    react-bootstrap/NavbarContext:  undefined ()
    react-bootstrap/NavbarToggle:  undefined ()
    react-bootstrap/Overlay:  undefined ()
    react-bootstrap/OverlayTrigger:  undefined ()
    react-bootstrap/PageItem:  undefined ()
    react-bootstrap/Pagination:  undefined ()
    react-bootstrap/Popover:  undefined ()
    react-bootstrap/PopoverContent:  undefined ()
    react-bootstrap/PopoverTitle:  undefined ()
    react-bootstrap/ProgressBar:  undefined ()
    react-bootstrap/ResponsiveEmbed:  undefined ()
    react-bootstrap/Row:  undefined ()
    react-bootstrap/SafeAnchor:  undefined ()
    react-bootstrap/SelectableContext:  undefined ()
    react-bootstrap/Spinner:  undefined ()
    react-bootstrap/SplitButton:  undefined ()
    react-bootstrap/Switch:  undefined ()
    react-bootstrap/Tab:  undefined ()
    react-bootstrap/TabContainer:  undefined ()
    react-bootstrap/TabContent:  undefined ()
    react-bootstrap/TabContext:  undefined ()
    react-bootstrap/TabPane:  undefined ()
    react-bootstrap/Table:  undefined ()
    react-bootstrap/Tabs:  undefined ()
    react-bootstrap/ThemeProvider:  undefined ()
    react-bootstrap/Toast:  undefined ()
    react-bootstrap/ToastBody:  undefined ()
    react-bootstrap/ToastContext:  undefined ()
    react-bootstrap/ToastHeader:  undefined ()
    react-bootstrap/ToggleButton:  undefined ()
    react-bootstrap/ToggleButtonGroup:  undefined ()
    react-bootstrap/Tooltip:  undefined ()
    react-bootstrap/createChainedFunction:  undefined ()
    react-bootstrap/createWithBsPrefix:  undefined ()
    react-bootstrap/divWithClassName:  undefined ()
    react-bootstrap/helpers:  undefined ()
    react-bootstrap/transitionEndListener:  undefined ()
    react-bootstrap/triggerBrowserReflow:  undefined ()
    react-bootstrap/types:  undefined ()
    react-bootstrap/usePopperMarginModifiers:  undefined ()
    react-bootstrap/useWrappedRefWithWarning:  undefined ()
    react-csv: ^2.0.3 => 2.2.2
    react-date-picker: ^8.1.1 => 8.4.0
    react-dom: ^16.8.4 => 16.14.0
    react-ga4: ^1.0.2 => 1.4.1
    react-hook-form: ^6.13.1 => 6.15.8
    react-icons: ^4.3.1 => 4.3.1
    react-iframe: ^1.8.0 => 1.8.0
    react-infinite-scroller: ^1.2.4 => 1.2.6
    react-phone-input-2: ^2.15.0 => 2.15.0
    react-pro-sidebar: ^0.5.0 => 0.5.0
    react-router-dom: ^5.2.0 => 5.3.1
    react-test-renderer: ^16.13.1 => 16.14.0
    react-to-print: ^2.12.6 => 2.14.7
    reactjs-popup: ^2.0.5 => 2.0.5
    redux: ^4.0.5 => 4.2.0
    sass-loader: ^7.1.0 => 7.3.1
    style-loader: ^1.2.1 => 1.3.0
    styled-components: ^5.3.0 => 5.3.5
    styled-components/macro:  undefined ()
    styled-components/native:  undefined ()
    styled-components/primitives:  undefined ()
    url-loader: ^4.1.1 => 4.1.1 (2.3.0)
    webpack: ^4.29.6 => 4.46.0
    webpack-cli: ^3.3.12 => 3.3.12
    webpack-dev-server: ^3.2.1 => 3.11.3
    yup: ^0.32.8 => 0.32.11
  npmGlobalPackages:
    expo-cli: 5.3.1
    mirror-config-china: 2.5.1
    node-sass: 7.0.1
    react-native: 0.68.1

Describe the bug

We have a cognito user pool which has MFA as optional. When we enable the MFA through React web application for a user through the SDK(using setUserMfaPreference method), the status in AWS console is not reflecting the same. The console UI doesn't have any effect. It always shows as disabled. Also when we disable MFA for the same user from AWS cognito, UI the frontend application still persist the previous status(enabled) and prompt the user for MFA code .

Expected behavior

Whenever the user Enable/Disable the MFA Status using this SDK, AWS Cognito userpool should reflect the changes in MFA Status section.

Reproduction steps

  1. Install package (npm i amazon-cognito-identity-js)
  2. signUp a user with email, password (signUp)
  3. Add a mobile number for that user and verify the mobile number (updateAttributes & getAttributeVerificationCode)
  4. Once verified, Enable the MFA (setUserMfaPreference)
  5. Try login for this user, it will ask MFA code.
  6. Now login into AWS and open the user profile in cognito user pool
  7. MFA status will be shown as disabled

Code Snippet

var smsMfaSettings = {
        PreferredMfa: true,
        Enabled: true,
      };
      cognitoUser.setUserMfaPreference(smsMfaSettings, null, function(err, result) {
        if (err) {    
         console.log(err);
          return;
        } 
        console.log(result);
        return result;
  })

Log output

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

Chrome

Mobile Browser Version

No response

Additional information and screenshots

No response
@chrisbonifacio chrisbonifacio self-assigned this Jun 21, 2022
@chrisbonifacio chrisbonifacio added Auth Related to Auth components/category pending-triage Issue is pending triage amazon-cognito-identity-js Used for issues related to this specific package within the monorepo good first issue Good for newcomers labels Jun 21, 2022
@chrisbonifacio chrisbonifacio added this to To do in MLH Fellows Summer 2022 via automation Jul 27, 2022
@chrisbonifacio chrisbonifacio moved this from To do to In progress in MLH Fellows Summer 2022 Jul 27, 2022
@ahilashsasidharan
Copy link

ahilashsasidharan commented Aug 9, 2022 •
edited

@YazhiniGurubaran Hello, I've tried to reproduce your issue, but it seems to be only reproducible using the older user interface for the Amazon Cognito Console, and behaves as expected on the new Amazon Cognito Console interface. I was wondering if you were using the older Cognito Console and referencing SMS MFA method which would look like the below image:
Old Console Interface Image
If this is the case is it possible you could switch to the new console, and see if the same issue persists using the MFA setting and MFA method instead:
New Interface
Since if it is not reproducible in the new console this may have something to do with a deprecated parameter. Please let me know if I misunderstood anything, and if you experience the issue on the newer console interface let me know. Also if possible could you expand on where you mention

Also when we disable MFA for the same user from AWS cognito, UI the front end application still persist the previous status(enabled) and prompt the user for MFA code

If I understand correctly you try to disable it through the AWS console, and it still returns the callback requesting an MFA code.

@chrisbonifacio chrisbonifacio added pending-response Issue is pending response from the issue requestor and removed pending-triage Issue is pending triage labels Aug 10, 2022
@chrisbonifacio chrisbonifacio added bug Something isn't working Service Team Issues asked to the Service Team and removed pending-response Issue is pending response from the issue requestor labels Aug 10, 2022
@chrisbonifacio
Copy link
Contributor

Hi 👋 Closing this as we have not heard back from you. If you are still experiencing this issue and in need of assistance, please feel free to comment and provide us with any information previously requested by our team members so we can re-open this issue and be better able to assist you.

Thank you!

@chrisbonifacio chrisbonifacio moved this from In progress to Done in MLH Fellows Summer 2022 Sep 2, 2022
@chrisbonifacio chrisbonifacio closed this as not planned Won't fix, can't repro, duplicate, stale Sep 2, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@chrisbonifacio chrisbonifacio

@ahilashsasidharan ahilashsasidharan

Labels
amazon-cognito-identity-js Used for issues related to this specific package within the monorepo Auth Related to Auth components/category bug Something isn't working good first issue Good for newcomers Service Team Issues asked to the Service Team
Projects
MLH Fellows Summer 2022
Done
Milestone
No milestone
Development

No branches or pull requests
3 participants
@chrisbonifacio @YazhiniGurubaran @ahilashsasidharan