Amplify-js: Type '"AMAZON_COGNITO_USER_POOLS"' is not assignable to type 'GRAPHQL_AUTH_MODE'

[sakhmedbayev]

Describe the bug
Related docs

I think the issue is with how enum type GRAPHQL_AUTH_MODE is used in the interface GraphQLOptions

When trying to construct authMode in the following way:

await API.graphql(
          {
            query: CreateProduct,
            variables: {input: inputData},
            authMode: "AMAZON_COGNITO_USER_POOLS"
          }
        );

Typescript compilator produces this error:

Type '"AMAZON_COGNITO_USER_POOLS"' is not assignable to type 'GRAPHQL_AUTH_MODE'.ts(2322)
index.d.ts(47, 5): The expected type comes from property 'authMode' which is declared here on type 'GraphQLOptions'

Expected behavior
Error is gone if setting GraphQLOptions this way:

export interface GraphQLOptions {
    query: string | DocumentNode;
    variables?: object;
    authMode?: keyof typeof GRAPHQL_AUTH_MODE;
}

Environment

System:
    OS: macOS Mojave 10.14.6
    CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
    Memory: 235.32 MB / 8.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.13.0 - ~/.nvm/versions/node/v10.13.0/bin/node
    Yarn: 1.15.2 - ~/.nvm/versions/node/v10.13.0/bin/yarn
    npm: 6.8.0 - ~/.nvm/versions/node/v10.13.0/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Browsers:
    Chrome: 78.0.3904.87
    Firefox: 69.0.3
    Safari: 13.0.3
  npmPackages:
    lerna: ^3.18.3 => 3.18.3 
  npmGlobalPackages:
    @aws-amplify/cli: 3.17.0
    babel-cli: 6.26.0
    commitizen: 3.0.5
    cpy-cli: 2.0.0
    create-react-app-add-redux: 2.0.0
    create-react-native-app: 1.0.0
    depcheck: 0.8.3
    eslint: 4.18.2
    exp: 55.0.4
    expo-cli: 3.0.10
    gatsby-cli: 2.7.46
    graphcool: 0.11.5
    graphql-cli: 2.16.0
    graphql: 0.13.2
    minimatch: 3.0.4
    nodemon: 1.14.12
    now: 13.1.3
    npm: 6.8.0
    npmrc: 1.1.1
    prisma: 1.8.3
    tslint-config-prettier: 1.15.0
    tslint-react: 3.6.0
    tslint: 5.9.1
    typescript: 2.7.2
    undefined: 0.1.0
    yarn: 1.15.2

[anarerdene]

@sakhmedbayev why change your amplify client ? (AppsyncSDK - > Amplify Client)

[sakhmedbayev]

Sorry @anarerdene, not sure if I understand your question.

[joshua-davis-rose]

I'm also experiencing this issue. To add some further explanation, the issue is directly related to using typescript. The graphql method is defined as such:

graphql({ query: paramQuery, variables, authMode }: GraphQLOptions): Promise<GraphQLResult> | Observable<object>;

and GraphQLOptions is defined as such:

export interface GraphQLOptions {
    query: string | DocumentNode;
    variables?: object;
    authMode?: GRAPHQL_AUTH_MODE;
}

However, there is no publicly accessible enum for GRAPHQL_AUTH_MODE so when a developer passes in one of the enum values as a string instead, the Typescript compiler throws the error described in the original report.

A workaround is to add an ignore rule for the typescript compiler:

await API.graphql(
  {
    query: CreateProduct,
    variables: {input: inputData},
    // @ts-ignore
    authMode: "AMAZON_COGNITO_USER_POOLS"
  }
 );

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale[bot]]

This issue has been automatically closed because of inactivity. Please open a new issue if are still encountering problems.

[paragbaxi]

another solution is:
import { GRAPHQL_AUTH_MODE } from '@aws-amplify/api'

authMode: GRAPHQL_AUTH_MODE.AMAZON_COGNITO_USER_POOLS