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

API.graphql returns incorrect type for promise result #9545

Open Nicktho opened 2 years ago

Nicktho commented 2 years ago

Before opening, please confirm:

JavaScript Framework

React

Amplify APIs

GraphQL API

Amplify Categories

api

Environment information

``` # Put output below this line System: OS: macOS 11.3.1 CPU: (8) arm64 Apple M1 Memory: 126.09 MB / 8.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 16.3.0 - /opt/homebrew/bin/node npm: 7.15.1 - /opt/homebrew/bin/npm Browsers: Chrome: 97.0.4692.99 Firefox Developer Edition: 97.0 Safari: 14.1 npmPackages: @aws-amplify/api-graphql: ^2.2.19 => 2.2.19 @aws-amplify/auth: ^4.3.20 => 4.3.20 @aws-amplify/core: ^4.3.12 => 4.3.12 @emotion/react: ^11.7.0 => 11.7.1 @emotion/styled: ^11.6.0 => 11.6.0 (10.3.0) @mui/system: ^5.2.3 => 5.2.3 @mui/types: ^7.1.0 => 7.1.0 @react-aria/label: ^3.2.1 => 3.2.1 @storybook/addon-actions: ^6.4.14 => 6.4.14 @storybook/addon-essentials: ^6.4.14 => 6.4.14 @storybook/addon-links: ^6.4.14 => 6.4.14 @storybook/builder-webpack5: ^6.4.14 => 6.4.14 @storybook/manager-webpack5: ^6.4.14 => 6.4.14 @storybook/preset-create-react-app: ^4.0.0 => 4.0.0 @storybook/react: ^6.4.14 => 6.4.14 @testing-library/jest-dom: ^5.15.1 => 5.16.1 @testing-library/react: ^11.2.7 => 11.2.7 @testing-library/user-event: ^12.8.3 => 12.8.3 @types/jest: ^27.4.0 => 27.4.0 @types/node: ^16.11.20 => 16.11.20 (14.18.9) @types/react: ^17.0.38 => 17.0.38 @types/react-dom: ^17.0.11 => 17.0.11 @typescript-eslint/eslint-plugin: ^4.33.0 => 4.33.0 (5.10.1) aws-amplify: ^4.3.12 => 4.3.12 emotion-normalize: ^11.0.1 => 11.0.1 emotion-reset: ^3.0.1 => 3.0.1 eslint: ^7.32.0 => 7.32.0 (8.7.0) eslint-config-airbnb: ^19.0.2 => 19.0.2 (18.2.1) eslint-config-airbnb-typescript: ^12.3.1 => 12.3.1 eslint-plugin-jest: ^24.7.0 => 24.7.0 (25.7.0) eslint-plugin-jsx-a11y: ^6.5.1 => 6.5.1 eslint-plugin-react: ^7.27.1 => 7.27.1 eslint-plugin-react-hooks: ^4.3.0 => 4.3.0 eslint-plugin-testing-library: ^3.10.2 => 3.10.2 (5.0.4) formik: ^2.2.9 => 2.2.9 react: ^17.0.2 => 17.0.2 react-confetti: ^6.0.1 => 6.0.1 react-dom: ^17.0.2 => 17.0.2 react-router-dom: ^6.0.2 => 6.1.1 react-scripts: ^5.0.0 => 5.0.0 swr: ^1.1.2 => 1.1.2 swr-immutable: 0.0.1 swr-infinite: 0.0.1 typescript: ^4.5.2 => 4.5.3 web-vitals: ^1.1.2 => 1.1.2 webpack: ^5.67.0 => 5.67.0 (4.46.0) npmGlobalPackages: @aws-amplify/cli: 7.6.2 aws-cdk: 1.132.0 create-next-app: 11.0.1 create-react-app: 4.0.3 n: 7.1.0 npm: 7.15.1 pure-prompt: 1.16.0 vercel: 23.0.1 ```

Describe the bug

API.graphql() return type is Promise<GraphQLResult> | Observable<object>.

Although, when using amplify the errors object on a GraphQLResult does not conform to the type GraphQLError[] as defined by GraphQLResult.

The following properties exist on the errors object that are not in the type : errorInfo, errorType.

Expected behavior

I expect the type returned by API.graphql() to allow the addition of the errorInfo and errorType attributes so that I can act on them in a typescript project using amplify.

Reproduction steps

  1. npm install aws-amplify
  2. import API from aws-amplify
  3. Make a call to graphql and try to act on errorInfo and errorType

Code Snippet

// Put your code below this line.
(API.graphql({
  query: someQuery,
  // we have to narrow the type as it can return an Observable for subscriptions
}) as Promise<GraphQLResult<object>>).then((result) => {
  // below typescript error for errorType, see screenshot
  console.log(result.errors?.errorType);
});

image

Log output

``` // Put your logs below this line Property 'errorType' does not exist on type 'GraphQLError[]'.ts(2339) ```

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

ebisbe commented 2 years ago

I was searching for the exact same thing. @Nicktho Did you define a custom graphql type?

jimblanc commented 1 year ago

We have published an RFC on our plan for improving TypeScript support in Amplify JS & would love to get your feedback & suggestions!

RFC: Amplify JS TypeScript Improvements

cwomack commented 1 year ago

With the release of the latest major version of Amplify (aws-amplify@>6), this issue should now be resolved! Please refer to our release announcement, migration guide, and documentation for more information.

josefaidt commented 1 month ago

re-opening as this is still an issue