search

aws-amplify / amplify-js

A declarative JavaScript library for application development using cloud services.
https://docs.amplify.aws/lib/q/platform/js
Apache License 2.0
9.41k stars 2.12k forks source link

Auth attributes_required error not caught #9347

Closed alan-cooney closed 2 years ago

alan-cooney commented 2 years ago

Before opening, please confirm:

JavaScript Framework

Next.js

Amplify APIs

Authentication

Amplify Categories

auth

Environment information

``` # Put output below this line System: OS: Linux 5.10 Ubuntu 20.04.2 LTS (Focal Fossa) CPU: (4) x64 Intel(R) Core(TM) i7-7660U CPU @ 2.50GHz Memory: 6.17 GB / 12.26 GB Container: Yes Shell: 5.0.17 - /bin/bash Binaries: Node: 14.17.4 - /usr/bin/node Yarn: 1.22.5 - /usr/bin/yarn npm: 6.14.14 - /usr/bin/npm Browsers: Firefox: 94.0 npmPackages: @ampproject/toolbox-optimizer: undefined () @apollo/client: ^3.5.5 => 3.5.6 @apollo/client/cache: undefined () @apollo/client/core: undefined () @apollo/client/errors: undefined () @apollo/client/link/batch: undefined () @apollo/client/link/batch-http: undefined () @apollo/client/link/context: undefined () @apollo/client/link/core: undefined () @apollo/client/link/error: undefined () @apollo/client/link/http: undefined () @apollo/client/link/persisted-queries: undefined () @apollo/client/link/retry: undefined () @apollo/client/link/schema: undefined () @apollo/client/link/utils: undefined () @apollo/client/link/ws: undefined () @apollo/client/react: undefined () @apollo/client/react/components: undefined () @apollo/client/react/context: undefined () @apollo/client/react/hoc: undefined () @apollo/client/react/hooks: undefined () @apollo/client/react/parser: undefined () @apollo/client/react/ssr: undefined () @apollo/client/testing: undefined () @apollo/client/testing/core: undefined () @apollo/client/utilities: undefined () @apollo/client/utilities/globals: undefined () @babel/core: undefined () @googlemaps/jest-mocks: ^1.3.8 => 1.5.0 @graphql-codegen/add: ^3.1.0 => 3.1.0 @graphql-codegen/cli: ^2.2.2 => 2.3.0 @graphql-codegen/typed-document-node: ^2.2.0 => 2.2.1 @graphql-codegen/typescript: ^2.3.0 => 2.4.1 @graphql-codegen/typescript-operations: ^2.2.0 => 2.2.1 @graphql-typed-document-node/core: ^3.1.0 => 3.1.1 @hookform/error-message: ^2.0.0 => 2.0.0 @material-ui/core: ^4.12.3 => 4.12.3 @material-ui/pickers: ^3.3.10 => 3.3.10 @next/bundle-analyzer: ^12.0.2 => 12.0.7 @peculiar/webcrypto: undefined () @sentry/integrations: ^6.15.0 => 6.16.0 @sentry/nextjs: ^6.15.0 => 6.16.0 @testing-library/jest-dom: ^5.15.1 => 5.16.1 @testing-library/react: ^12.1.2 => 12.1.2 @testing-library/react-hooks: ^7.0.2 => 7.0.2 @testing-library/user-event: ^13.5.0 => 13.5.0 @types/google.maps: ^3.46.0 => 3.47.1 @types/jest: ^27.0.2 => 27.0.3 @types/luxon: ^2.0.5 => 2.0.7 @types/node: ^16.11.10 => 16.11.12 @types/object-path: ^0.11.1 => 0.11.1 @types/react: ^17.0.37 => 17.0.37 @types/react-bootstrap-typeahead: ^5.1.8 => 5.1.8 @types/react-draft-wysiwyg: ^1.13.3 => 1.13.3 @types/react-imgix: ^9.2.0 => 9.3.0 @types/react-instantsearch-dom: ^6.12.0 => 6.12.1 @types/uuid: ^8.3.1 => 8.3.3 @typescript-eslint/eslint-plugin: ^5.3.0 => 5.6.0 (4.33.0) @typescript-eslint/parser: ^5.3.0 => 5.6.0 (4.33.0) @vercel/nft: undefined () ajv: ^8.6.3 => 8.8.2 (6.12.6) algoliasearch: ^4.11.0 => 4.11.0 amphtml-validator: undefined () analytics: ^0.7.18 => 0.7.18 apollo-link-sentry: ^3.0.2 => 3.0.2 arg: undefined () async-retry: undefined () async-sema: undefined () aws-amplify: ^4.3.4 => 4.3.10 aws-amplify-react: ^5.1.5 => 5.1.9 aws-appsync-auth-link: ^3.0.7 => 3.0.7 aws-sdk: ^2.1036.0 => 2.1046.0 axios: ^0.24.0 => 0.24.0 (0.21.4) babel-jest: ^27.3.1 => 27.4.4 (26.6.3) babel-packages: undefined () browser-sync: ^2.27.7 => 2.27.7 change-case: ^4.1.2 => 4.1.2 ci-info: undefined () cli-select: undefined () comment-json: undefined () compression: undefined () conf: undefined () content-disposition: undefined () content-type: undefined () cookie: undefined () cross-env: ^7.0.2 => 7.0.3 cross-fetch: ^3.1.4 => 3.1.4 cross-fetch-polyfill: 0.0.0 cross-spawn: undefined () debug: undefined () devalue: undefined () draft-js: ^0.11.7 => 0.11.7 draftjs-to-html: ^0.9.1 => 0.9.1 escape-string-regexp: undefined () eslint: ^8.3.0 => 8.4.1 (7.32.0) eslint-config-airbnb-base: ^15.0.0 => 15.0.0 eslint-config-airbnb-typescript: ^16.0.0 => 16.1.0 eslint-config-prettier: ^8.3.0 => 8.3.0 eslint-import-resolver-typescript: ^2.5.0 => 2.5.0 eslint-loader: ^4.0.2 => 4.0.2 eslint-plugin-import: ^2.25.2 => 2.25.3 eslint-plugin-jest: ^25.3.0 => 25.3.0 (24.7.0) eslint-plugin-jest-dom: ^3.9.2 => 3.9.2 eslint-plugin-jsx-a11y: ^6.4.1 => 6.5.1 eslint-plugin-prettier: ^4.0.0 => 4.0.0 eslint-plugin-react: ^7.26.1 => 7.27.1 eslint-plugin-react-hooks: ^4.2.0 => 4.3.0 eslint-plugin-testing-library: ^5.0.0 => 5.0.1 (3.10.2) eventfan: ^1.0.2 => 1.0.2 faker: ^5.5.3 => 5.5.3 file-saver: ^2.0.5 => 2.0.5 find-cache-dir: undefined () find-up: undefined () flattenjs: ^2.1.3 => 2.1.3 formdata-node: undefined () formik: ^2.2.9 => 2.2.9 fresh: undefined () glob: undefined () graphql: ^16.0.1 => 16.1.0 (14.5.0, 14.0.0) gzip-size: undefined () http-proxy: undefined () icss-utils: undefined () identity-obj-proxy: ^3.0.0 => 3.0.0 ignore-loader: undefined () is-animated: undefined () is-docker: undefined () is-wsl: undefined () jest: ^27.3.1 => 27.4.4 (26.6.0) js-cookie: ^3.0.1 => 3.0.1 (2.2.1) json5: undefined () jsonwebtoken: undefined () jszip: ^3.7.1 => 3.7.1 jszip-utils: ^0.1.0 => 0.1.0 libphonenumber-js: ^1.9.39 => 1.9.44 libphonenumber-js-core: 1.0.0 libphonenumber-js-max: 1.0.0 libphonenumber-js-min: 1.0.0 libphonenumber-js-mobile: 1.0.0 loader-utils: undefined () local-ssl-proxy: ^1.3.0 => 1.3.0 lodash.curry: undefined () lru-cache: undefined () luxon: ^2.0.2 => 2.1.1 micromatch: undefined () mini-css-extract-plugin: undefined () minimist: ^1.2.5 => 1.2.5 moment: ^2.29.1 => 2.29.1 nanoid: ^3.1.30 => undefined (3.1.30, ) native-url: undefined () neo-async: undefined () next: ^12.0.4 => 12.0.7 next-unused: ^0.0.6 => 0.0.6 nextjs-progressbar: ^0.0.13 => 0.0.13 nock: ^13.1.4 => 13.2.1 node-libs-browser: undefined () object-path: ^0.11.8 => 0.11.8 ora: undefined () papaparse: ^5.3.1 => 5.3.1 patch-package: ^6.4.7 => 6.4.7 postal-address-field-names: ^1.0.3 => 1.0.3 postcss-flexbugs-fixes: undefined () postcss-modules-extract-imports: undefined () postcss-modules-local-by-default: undefined () postcss-modules-scope: undefined () postcss-modules-values: undefined () postcss-preset-env: undefined () postcss-safe-parser: undefined () postcss-scss: undefined () postcss-value-parser: undefined () posthog-js: ^1.16.7 => 1.16.7 posthog-js-react: 1.0.0-alpha.1 prettier: ^2.5.0 => 2.5.1 qs: ^6.10.1 => 6.10.2 (6.7.0, 6.2.3) query-string: ^7.0.1 => 7.0.1 (4.3.4) react: 17.0.2 => 17.0.2 react-app-polyfill: ^2.0.0 => 2.0.0 react-bootstrap: ^1.6.4 => 1.6.4 react-bootstrap-table-next: ^4.0.3 => 4.0.3 react-bootstrap-table2-filter: ^1.2.0 => 1.3.3 react-bootstrap-typeahead: ^5.2.0 => 5.2.1 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-datetime-picker: ^3.4.2 => 3.4.3 react-dom: 17.0.2 => 17.0.2 react-draft-wysiwyg: ^1.14.7 => 1.14.7 react-dropzone: ^11.4.2 => 11.4.2 (11.3.4) react-google-places-autocomplete: ^3.3.2 => 3.3.2 react-hook-form: ^7.20.3 => 7.21.2 react-icons: ^4.3.1 => 4.3.1 react-imgix: ^9.3.0 => 9.3.0 react-instantsearch-dom: ^6.16.0 => 6.17.0 react-intl-tel-input: ^8.1.1 => 8.2.0 react-moment: ^1.1.1 => 1.1.1 react-phone-input-2: ^2.14.0 => 2.14.0 react-photo-gallery: ^8.0.0 => 8.0.0 react-script-hook: ^1.5.0 => 1.5.0 react-scripts: 4.0.3 => 4.0.3 react-server-dom-webpack: undefined () react-simple-maps: ^2.3.0 => 2.3.0 react-stars: ^2.2.5 => 2.2.5 react-test-renderer: ^17.0.2 => 17.0.2 resolve-url-loader: undefined () sass-loader: undefined () schema-utils: undefined () semver: undefined () send: undefined () slugify: ^1.6.1 => 1.6.3 source-map: undefined () speed-measure-webpack-plugin: ^1.5.0 => 1.5.0 stream-chat: ^4.3.0 => 4.4.3 stream-chat-react: ^6.12.0 => 6.12.2 string-hash: undefined () strip-ansi: undefined () striptags: ^3.2.0 => 3.2.0 terser: undefined () text-table: undefined () ts-jest: ^27.0.7 => 27.1.1 type-fest: ^2.6.0 => 2.8.0 (0.21.3, 0.8.1, 0.20.2, 0.6.0, 0.7.1, 0.3.1) typescript: ^4.4.4 => 4.5.3 (4.3.4, 3.9.10) ua-parser-js: undefined () unistore: undefined () uuid: ^8.3.1 => 8.3.2 (3.4.0, 3.3.2, ) vercel: ^23.1.2 => 23.1.2 web-streams-polyfill: undefined () web-vitals: undefined () webpack: undefined () webpack-sources: undefined () with-typescript: undefined () ws: undefined () npmGlobalPackages: npm: 6.14.14 ```

Describe the bug

When using social login (e.g. Google) we occasionally get an error whereby the user has not set an attribute that we require with Cognito (e.g. family_name). This throws an unhandled error which crashes the page.

next-dev.js?3515:32 [ERROR] 45:21.570 OAuth - Error handling auth response. Error: attributes+required%3A+%5Bfamily_name%5D

Expected behavior

The error should be handled and emitted with a Hub auth signIn_failure event.

Reproduction steps

  1. Setup social login with google
  2. Set an attribute as required in cognito which is not present in your google account that you will use to sign in
  3. Click the sign in with google button in your amplify website
  4. See unhandled exception

Code Snippet

No response

Log output

``` // Put your logs below this line next-dev.js?3515:32 [ERROR] 45:21.570 OAuth - Error handling auth response. Error: attributes+required%3A+%5Bfamily_name%5D at OAuth.eval (OAuth.js?3329:244) at step (OAuth.js?3329:55) at Object.eval [as next] (OAuth.js?3329:36) at eval (OAuth.js?3329:30) at new Promise () at __awaiter (OAuth.js?3329:26) at OAuth.handleAuthResponse (OAuth.js?3329:220) at AuthClass.eval (Auth.js?782d:1872) at step (Auth.js?782d:55) at Object.eval [as next] (Auth.js?782d:36) at eval (Auth.js?782d:30) at new Promise () at __awaiter (Auth.js?782d:26) at AuthClass._handleAuthResponse (Auth.js?782d:1834) at eval (Auth.js?782d:228) at eval (urlListener.js?0f6f:17) at AuthClass.configure (Auth.js?782d:222) at eval (Amplify.js?fdce:84) at Array.map () at AmplifyClass.configure (Amplify.js?fdce:83) at eval (_app.tsx?f9d6:23) at Module../src/pages/_app.tsx (_app.js?ts=1639151115475:14951) at Module.options.factory (webpack.js?ts=1639151115475:655) at __webpack_require__ (webpack.js?ts=1639151115475:37) at fn (webpack.js?ts=1639151115475:324) at eval (?63ed:5) at eval (route-loader.js?ea34:236) ```

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

chrisbonifacio commented 2 years ago

Hi @alan-cooney 👋 are you using the ui components from the aws-amplify-react? We've since put this package into maintenance mode and have released a new Amplify UI Library which we'd recommend using instead.

There are issues with using aws-amplify-react where its peer dependencies, pinned to older versions of amplify packages, are installed and cause multiple instances of Amplify and its modules to be initialized, resulting in unpredictable behavior.

Please try removing that package, using the new ui library instead, and let me know if this helps.

In the meantime I will reproduce this issue and see if happens with the latest versions of our packages.

alan-cooney commented 2 years ago

Hi @chrisbonifacio - I've removed that now and the issue still persists. You can also see the issue live by logging in at www.skyhookadventure.com with a google account that has no family name/last name set

chrisbonifacio commented 2 years ago

Hi @alan-cooney I tried logging into the site you linked and it seemed to work. Let me know if you're still experiencing issues.

chrisbonifacio commented 2 years ago

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!

emmarq commented 2 years ago

Hi, a similar issue is happening here. So far is consistent with the following scenario:

  1. A user sign up using apple, grants a permission within the respective apple account to cognito, in cognito some data is saved in the user pool, and the oauth authentication flow goes normally for the user, who enters the app.
  2. The user data in the user pool in Cognito is deleted.
  3. The user tries again to login with the same apple account.
  4. The user can not login anymore and the following error appears in console 
    [ERROR] 56:34.742 OAuth - Error handling auth response. [Error: Invalid+user+attributes%3A+name%3A+The+attribute+is+required%0A+]

The only way so far to get rid of that error is going to https://appleid.apple.com/ and manually delete the permission granted to the app.

github-actions[bot] commented 1 year ago

This issue has been automatically locked since there hasn't been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server amplify-help forum.