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.43k stars 2.13k forks source link

Conflicting version after updating to v4.3.16 #9706

Closed laclance closed 2 years ago

laclance commented 2 years ago

Before opening, please confirm:

JavaScript Framework

React

Amplify APIs

DataStore

Amplify Categories

auth, api

Environment information

``` # Put output below this line System: OS: Windows 10 10.0.19042 CPU: (8) x64 Intel(R) Core(TM) i5-10210U CPU @ 1.60GHz Memory: 2.11 GB / 7.81 GB Binaries: Node: 16.14.0 - C:\Program Files\nodejs\node.EXE Yarn: 1.22.17 - C:\Program Files\nodejs\yarn.CMD npm: 8.3.1 - C:\Program Files\nodejs\npm.CMD Browsers: Edge: Spartan (44.19041.1266.0), Chromium (99.0.1150.39) Internet Explorer: 11.0.19041.1202 npmPackages: @ampproject/toolbox-optimizer: undefined () @babel/core: undefined () @babel/helper-call-delegate: ^7.12.1 => 7.12.13 @babel/runtime: 7.15.4 @capacitor-community/electron: ^4.0.3 => 4.1.0 @capacitor/android: ^3.3.1 => 3.4.3 @capacitor/app: ^1.0.5 => 1.1.1 @capacitor/core: ^3.3.1 => 3.4.3 @capacitor/device: ^1.0.5 => 1.1.2 @emotion/react: ^11.7.0 => 11.8.2 @emotion/server: ^11.4.0 => 11.4.0 @emotion/styled: ^11.6.0 => 11.8.1 @hapi/accept: undefined () @mui/icons-material: ^5.4.1 => 5.5.1 @mui/material: ^5.4.1 => 5.5.1 @mui/styles: ^5.4.1 => 5.5.1 @napi-rs/triples: undefined () @next/react-dev-overlay: undefined () @next/react-refresh-utils: 12.1.0 @peculiar/webcrypto: undefined () @types/crypto-js: ^4.0.2 => 4.1.1 @types/intl-tel-input: ^17.0.3 => 17.0.4 @types/madge: ^5.0.0 => 5.0.0 @types/node: 17.0.21 => 17.0.21 @types/qrcode.react: ^1.0.1 => 1.0.2 @types/react: ^17.0.39 => 17.0.40 @types/react-dom: ^17.0.13 => 17.0.13 @typescript-eslint/eslint-plugin: 5.15.0 => 5.15.0 @typescript-eslint/parser: 5.15.0 => 5.15.0 @vercel/nft: undefined () abort-controller: undefined () acorn: undefined () amphtml-validator: undefined () arg: undefined () array-move: ^4.0.0 => 4.0.0 assert: undefined () async-retry: undefined () async-sema: undefined () autoprefixer: ^10.4.2 => 10.4.3 aws-amplify: ^4.3.16 => 4.3.16 babel-packages: undefined () browserify-zlib: undefined () browserslist: undefined () buffer: undefined () chalk: undefined () ci-info: undefined () cli-select: undefined () clsx: ^1.1.1 => 1.1.1 comment-json: undefined () compression: undefined () conf: undefined () constants-browserify: undefined () content-disposition: undefined () content-type: undefined () cookie: undefined () cross-spawn: undefined () crypto-browserify: undefined () crypto-js: ^4.1.1 => 4.1.1 cssnano-simple: undefined () debug: undefined () devalue: undefined () domain-browser: undefined () eslint: 8.11.0 => 8.11.0 eslint-config-next: 12.1.0 => 12.1.0 eslint-plugin-prettier: ^4.0.0 => 4.0.0 eslint-plugin-react: ^7.29.2 => 7.29.4 eslint-plugin-react-hooks: ^4.2.0 => 4.3.0 etag: undefined () events: undefined () find-cache-dir: undefined () find-up: undefined () formdata-node: undefined () fresh: undefined () get-orientation: undefined () glob: undefined () graphql-tag: ^2.12.6 => 2.12.6 gzip-size: undefined () http-proxy: undefined () https-browserify: undefined () i18next: ^21.6.13 => 21.6.14 i18next-chained-backend: ^3.0.2 => 3.0.2 i18next-http-backend: ^1.3.2 => 1.4.0 i18next-locize-backend: ^5.0.0 => 5.0.1 icss-utils: undefined () ignore-loader: undefined () image-size: undefined () intl-tel-input: ^17.0.13 => 17.0.16 is-animated: undefined () is-docker: undefined () is-wsl: undefined () jest-worker: undefined () json5: undefined () jsonwebtoken: undefined () ksuid: ^3.0.0 => 3.0.0 loader-utils: undefined () locize-cli: ^7.9.1 => 7.10.0 lodash.curry: undefined () lru-cache: undefined () madge: ^5.0.1 => 5.0.1 micromatch: undefined () mini-css-extract-plugin: undefined () nanoid: undefined () native-url: undefined () neo-async: undefined () next: ^12.1.0 => 12.1.0 node-fetch: undefined () node-html-parser: undefined () ora: undefined () os-browserify: undefined () p-limit: undefined () path-browserify: undefined () postcss: ^8.4.7 => 8.4.11 (8.4.5, 7.0.39) 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 () prettier: ^2.4.1 => 2.6.0 process: undefined () punycode: undefined () qrcode.react: ^2.0.0 => 2.0.0 querystring-es3: undefined () raw-body: undefined () react: ^17.0.2 => 17.0.2 react-dnd: ^15.1.1 => 15.1.1 react-dnd-html5-backend: ^15.1.2 => 15.1.2 react-dom: ^17.0.2 => 17.0.2 react-i18next: ^11.15.5 => 11.15.7 react-indiana-drag-scroll: ^2.1.0 => 2.1.0 react-is: 17.0.2 react-loader-spinner: ^6.0.0-0 => 6.0.0-0 react-refresh: 0.8.3 react-scripts: 5.0.0 => 5.0.0 react-server-dom-webpack: undefined () react-simple-keyboard: ^3.4.73 => 3.4.80 regenerator-runtime: 0.13.4 sass-loader: undefined () schema-utils: undefined () semver: undefined () send: undefined () setimmediate: undefined () source-map: undefined () stream-browserify: undefined () stream-http: undefined () string-hash: undefined () string_decoder: undefined () strip-ansi: undefined () tailwindcss: ^3.0.13 => 3.0.23 terser: undefined () text-table: undefined () timers-browserify: undefined () tty-browserify: undefined () typescript: 4.6.2 => 4.6.2 (3.9.10) ua-parser-js: undefined () unistore: undefined () universal-cookie: ^4.0.4 => 4.0.4 util: undefined () uuid: undefined () vm-browserify: undefined () watchpack: undefined () web-streams-polyfill: undefined () web-vitals: undefined () webpack: undefined () webpack-sources: undefined () ws: undefined () npmGlobalPackages: @aws-amplify/cli: 7.6.24 corepack: 0.10.0 npm: 8.3.1 yarn: 1.22.17 ```

Describe the bug

Been running datastore for almost 2 years and never had an auth issue until upgrading to aws-amplify v4.3.16 downgrading to 4.3.15 gets rid of the error

get this error twice when starting app

    next-dev.js?3515:32 [ERROR] 01:55.808 AuthError - 
            Error: Amplify has not been configured correctly. 
            The configuration object is missing required auth properties.
            This error is typically caused by one of the following scenarios:

            1. Did you run `amplify push` after adding auth via `amplify add auth`?
                See https://aws-amplify.github.io/docs/js/authentication#amplify-project-setup for more information

            2. This could also be caused by multiple conflicting versions of amplify packages, see 
            3.     (https://docs.amplify.aws/lib/troubleshooting/upgrading/q/platform/js) for help upgrading Amplify packages.

Also get this error when running amplify pull

    Edit your schema at C:\Users\Jacqui De Villiers\Desktop\to-pos-nextjs\amplify\backend\api\tallorderdatastore\schema.graphql 
    or place .graphql files in a directory at C:\Users\Jacqui De Villiers\Desktop\to-pos- 
   nextjs\amplify\backend\api\tallorderdatastore\schema

Expected behavior

Amplify and datastore should run as normal

Reproduction steps

Create and amplify datastore project with lastest aws-amplify version add Amplify.configure({ ...aws_exports, ssr: true }); in _app.tsx run yarn && yarn dev

Code Snippet

// Put your code below this line.
import { Amplify, DataStore, syncExpression } from 'aws-amplify';

Amplify.configure({ ...aws_exports, ssr: true });

if (typeof window !== 'undefined') {
  (window as any).LOG_LEVEL = 'DEBUG';
  DataStore.configure({
    syncExpressions: [
      syncExpression(TallorderPos, () => {
        const { id, sellingLocationId } = JSON.parse(window.localStorage.getItem('MerchantState') || '{}');
        return c => c.pk('eq', sellingLocationId.length ? `merchant#${id}#location#${sellingLocationId}` : 'null');
      }) as any
    ]
  });
}

Log output

``` // Put your logs below this line λ amplify pull Pre-pull status: (node:3424) [DEP0128] DeprecationWarning: Invalid 'main' field in 'C:\Users\Jacqui De Villiers\AppData\Roaming\nvm\v16.14.0\node_modules\@aws-amplify\cli\node_modules\cloudform\package.json' of 'packages/cloudform/index.js'. Please either fix that or report it to the module author ``` λ yarn upgrade --latest --pattern aws-amplify ``` yarn upgrade v1.22.17 [1/4] Resolving packages... [2/4] Fetching packages... [3/4] Linking dependencies... warning "@emotion/react > @emotion/babel-plugin@11.7.2" has unmet peer dependency "@babel/core@^7.0.0". warning "@emotion/react > @emotion/babel-plugin > @babel/plugin-syntax-jsx@7.16.7" has unmet peer dependency "@babel/core@^7.0.0-0". warning "aws-amplify > @aws-amplify/analytics > @aws-sdk/client-firehose > @aws-sdk/middleware-retry > react-native-get-random-values@1.7.2" has unmet peer dependency "react-native@>=0.56". warning " > graphql-tag@2.12.6" has unmet peer dependency "graphql@^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0". warning "react-loader-spinner > styled-components@5.3.3" has unmet peer dependency "react-is@>= 16.8.0". warning "react-scripts > eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-syntax-flow@^7.14.5". warning "react-scripts > eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-transform-react-jsx@^7.14.9". [4/4] Rebuilding all packages... success Saved lockfile. success Saved 0 new dependencies. Done in 37.21s. ``` λ yarn list --pattern amplify && Select-String -Pattern '(@?aws\-amplify[^@]*).*(?

aws-exports.js

const awsmobile = {
  aws_project_region: 'eu-west-1',
  aws_appsync_graphqlEndpoint: '771bff1d-1f0a-451e-9dc2-de153a113afd',
  aws_appsync_region: 'eu-west-1',
  aws_appsync_authenticationType: 'API_KEY',
  aws_appsync_apiKey: 'da2-7hneoyft2ncqpfdp2us4y5twoa'
};

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

Server console also prints The schema has already been initialized previously were mitigating this message by editing models/index.js

let TallorderPos, TallorderSettings;
if (typeof window !== 'undefined') {
  const { TallorderPos: TOPos, TallorderSettings: TOSettings } = initSchema(schema);
  TallorderPos = TOPos;
  TallorderSettings = TOSettings;
}
chrisbonifacio commented 2 years ago

Hi @laclance 👋 I don't see that you have a user pool defined in your aws-exports file. I just copy/pasted the aws_exports config you shared and the error I'm seeing has to do with a missing user pool id.

Also, your graphql endpoint is not a url, but an ID for some reason.

Screen Shot 2022-03-17 at 11 05 14 AM

This might be fixed if you were to run amplify pull to overwrite and correct the aws-exports.js file but I see that the error logs you shared show you got an error when trying to run the command. Are you still experiencing that issue with amplify pull?

Can you check to make sure you have a schema.graphql file in your amplify/backend/api/<apiName>/ directory?

If you do, can you share the schema?

Lastly, can you run amplify status and share the output?

guillaumesmo commented 2 years ago

I think this issue was caused by the following change of PR #9628 https://github.com/aws-amplify/amplify-js/pull/9628/files#diff-d7133ba15216009e91d0c1632f34aa2279f4e6a03873e701c4abf582e011ed5fR1639

The comment above says "Purposely not calling the reject method here because we don't need a console error" yet the developer changed the line to call said reject method

I worked around the issue by pinning @aws-amplify/auth to 4.4.2, yet I hope to see that change reverted :D

chrisbonifacio commented 2 years ago

@guillaumesmo did you have @aws-amplify/auth installed separately alongside aws-amplify? From your env info I could only see aws-amplify was installed and so I was trying to reproduce with only that package.

guillaumesmo commented 2 years ago

You can reproduce it easily with the AWS Location Service Go to Maps, click on a map and go to the "Embed this map in your web application" tab https://eu-west-1.console.aws.amazon.com/location/maps/home?region=eu-west-1#/describe/explore.map/embed you'll need a Cognito identity pool ID and fill it in the placeholder

Replace the following 3 lines:

    <script src="https://cdn.amplify.aws/packages/core/4.3.0/aws-amplify-core.min.js" integrity="sha384-7Oh+5w0l7XGyYvSqbKi2Q7SA5K640V5nyW2/LEbevDQEV1HMJqJLA1A00z2hu8fJ" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdn.amplify.aws/packages/auth/4.3.8/aws-amplify-auth.min.js" integrity="sha384-jfkXCEfYyVmDXYKlgWNwv54xRaZgk14m7sjeb2jLVBtUXCD2p+WU8YZ2mPZ9Xbdw" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdn.amplify.aws/packages/geo/1.1.0/aws-amplify-geo.min.js" integrity="sha384-TFMTyWuCbiptXTzvOgzJbV8TPUupG1rA1AVrznAhCSpXTIdGw82bGd8RTk5rr3nP" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

with the following:

        <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/core@4.4.1/dist/aws-amplify-core.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/auth@4.4.3/dist/aws-amplify-auth.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/geo@1.2.2/dist/aws-amplify-geo.min.js"></script>

error appears in the browser console, while the map works as expected

auth 4.4.2 works without error:

        <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/core@4.4.0/dist/aws-amplify-core.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/auth@4.4.2/dist/aws-amplify-auth.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/geo@1.2.1/dist/aws-amplify-geo.min.js"></script>
chrisbonifacio commented 2 years ago

@guillaumesmo I'm able to reproduce the issue with these packages

 <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/core@4.4.1/dist/aws-amplify-core.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/auth@4.4.3/dist/aws-amplify-auth.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/@aws-amplify/geo@1.2.2/dist/aws-amplify-geo.min.js"></script>

but the scripts provided by the Amazon Location console seem to be compatible, I'm not able to reproduce the issue from copy/pasting the code snippet

In any case, if you run into errors or strange behavior like this, it is usually because of mismatching package versions in the dependency tree which cause multiple instances of Amplify to initialize.

For more information: https://docs.amplify.aws/lib/troubleshooting/upgrading/q/platform/js/

laclance commented 2 years ago

still get this error with any version above 4.3.15 but amplify and datastore still seem to work fine, although annoying to have a whole bunch of error lines in my console.

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.