Graphql-code-generator: Consume Schema from Apollo Graph Manager

[mikefisher84]

Apollo Engine/Graph Manager is the published source of truth for our GraphQL schema. I'd like to automatically generate my typescript types based on the information in Apollo Engine/Graph Manager

Describe the solution you'd like
I'd like for graphql-code-generator to be able to pull down the schema from Apollo Engine/Graph Manager. I'd also like to be able to specific the schema variant if possible.

Describe alternatives you've considered
Using Apollo CLI for type generation

If this is already possible my apologies!

[ardatan]

@mikefisher84
We already have this feature for a while;
https://github.com/dotansimha/graphql-code-generator/issues/3047

[mikefisher84]

Thanks for the heads up Arda! This feature doesn't seem to be documented.

I checked the changelog for v1.10.0 and I didn't see it unless I'm missing something. I tried using the config from your comment here and I'm getting an error. Any idea what I'm missing?

my config

schema:
  - apollo-engine:
    engine:
      apiKey: ${APOLLO_KEY}
    client:
      service:garbanzo@current
overwrite: true
generates:
  ./src/graphql/generated/introspection-result.ts:
    plugins:
      - fragment-matcher

ERROR:

./src/graphql/generated/introspection-result.ts
    Failed to load schema from apollo-engine,engine,client:

        Cannot read property 'endpoint' of undefined
        TypeError: Cannot read property 'endpoint' of undefined

        GraphQL Code Generator supports:
          - ES Modules and CommonJS exports (export as default or named export "schema")
          - Introspection JSON File
          - URL of GraphQL endpoint
          - Multiple files with type definitions (glob expression)
          - String in config file

[ardatan]

Yes you're right. We haven't documented it yet :( Default value for endpoint has been added but I think it is not in the codegen yet.
I'll take a look at the issue and keep you posted.

[ardatan]

@mikefisher84 Could you fix the indentation like below;

schema:
  - apollo-engine:
       engine:
         apiKey: ${APOLLO_KEY}
       client:
         service:garbanzo@current
overwrite: true
generates:
  ./src/graphql/generated/introspection-result.ts:
    plugins:
      - fragment-matcher

[mikefisher84]

Thanks @ardatan ! I just copy and pasted what you wrote and now have a new error:

 graphql-codegen --config codegen.yml
  ✔ Parse configuration
  ❯ Generate outputs
    ❯ Generate ./src/graphql/generated/introspection-result.ts
      ✖ Load GraphQL schemas
        → Failed to load schema
        Load GraphQL documents
        Generate


 Found 1 error

  ✖ ./src/graphql/generated/introspection-result.ts
    Failed to load schema from apollo-engine:

        Only absolute URLs are supported
        TypeError: Only absolute URLs are supported
at getNodeRequestOptions (app/node_modules/node-fetch/lib/index.js:1299:9)
    at app/node_modules/node-fetch/lib/index.js:1404:19
    at new Promise (<anonymous>)
    at Function.fetch (app/node_modules/node-fetch/lib/index.js:1401:9)
    at Function.fetch (app/node_modules/cross-fetch/dist/node-ponyfill.js:10:20)
    at ApolloEngineLoader.load (app/node_modules/@graphql-toolkit/apollo-engine-loader/index.cjs.js:19:43)
    at loadFile (app/node_modules/@graphql-toolkit/core/index.cjs.js:78:37)
    at async app/node_modules/@graphql-toolkit/core/index.cjs.js:481:24

        GraphQL Code Generator supports:
          - ES Modules and CommonJS exports (export as default or named export "schema")
          - Introspection JSON File
          - URL of GraphQL endpoint
          - Multiple files with type definitions (glob expression)
          - String in config file

        Try to use one of above options and run codegen again.
    Error: Failed to load schema
        at loadSchema (app/node_modules/@graphql-codegen/cli/bin.js:406:15)
    Error: Failed to load schema
        at loadSchema (app/node_modules/@graphql-codegen/cli/bin.js:406:15)

[ardatan]

Are you using the latest version of codegen?
@mikefisher84

[mikefisher84]

Ha nope I wasn't @ardatan I updated and am getting a new error

✖ ./src/graphql/generated/introspection-result.ts
    Failed to load schema from apollo-engine:

            Variable "$tag" of required type "String!" was not provided.
    Variable "$id" of required type "ID!" was not provided.
            Error: Variable "$tag" of required type "String!" was not provided.
    Variable "$id" of required type "ID!" was not provided.
        at ApolloEngineLoader.load (app/node_modules/@graphql-tools/apollo-engine-loader/index.cjs.js:41:19)
        at processTicksAndRejections (internal/process/task_queues.js:97:5)
        at async loadFile (app/node_modules/@graphql-tools/load/index.cjs.js:48:24)
        at async app/node_modules/@graphql-tools/load/index.cjs.js:425:24

            GraphQL Code Generator supports:
              - ES Modules and CommonJS exports (export as default or named export "schema")
              - Introspection JSON File
              - URL of GraphQL endpoint
              - Multiple files with type definitions (glob expression)
              - String in config file

I just looked at the changelog for v1.15 and noticed this section

Introduce automatic JSON schema validation and auto complete for your codegen.yml. 
If you are using VSCode, make sure you have this extension installed: 
https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml

So I installed the yaml plugin in VS Code and I'm getting three yaml linting errors.

# Incorrect type. Expected "object".
# Property engine is not allowed
# Property client is not allowed

schema:
  - apollo-engine: # Incorrect type. Expected "object".
      engine: # Property engine is not allowed
        apiKey: ${APOLLO_KEY}
      client: service:garbanzo@current # Property client is not allowed

[dotansimha]

@mikefisher84 I'll fix that later, you can ignore that error for now, it's just a IDE validation.

[mikefisher84]

Thanks @dotansimha however it still seems to not generate the types with the config that @ardatan posted. CLI returns

 Variable "$tag" of required type "String!" was not provided.
    Variable "$id" of required type "ID!" was not provided.
            Error: Variable "$tag" of required type "String!" was not provided.
    Variable "$id" of required type "ID!" was not provided.

[ardatan]

Could you try the following?

schema:
  - apollo-engine: 
      engine:
        apiKey: ${APOLLO_KEY}
      graph: service:garbanzo
      variant: current

[mikefisher84]

Thanks @ardatan getting closer. Now I'm getting a 406 error.

✖ ./src/graphql/generated/introspection-result.ts
    Failed to load schema from apollo-engine:

        406: Not Acceptable
        Error: 406: Not Acceptable
    at ApolloEngineLoader.load (app/node_modules/@graphql-tools/apollo-engine-loader/index.cjs.js:41:19)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
    at async loadFile (app/node_modules/@graphql-tools/load/index.cjs.js:48:24)
    at async app/node_modules/@graphql-tools/load/index.cjs.js:425:24

        GraphQL Code Generator supports:
          - ES Modules and CommonJS exports (export as default or named export "schema")
          - Introspection JSON File
          - URL of GraphQL endpoint
          - Multiple files with type definitions (glob expression)
          - String in config file

        Try to use one of above options and run codegen again.
    Error: Failed to load schema
        at loadSchema (app/node_modules/@graphql-codegen/cli/bin.js:407:15)
        at processTicksAndRejections (internal/process/task_queues.js:97:5)
    Error: Failed to load schema
        at loadSchema (app/node_modules/@graphql-codegen/cli/bin.js:407:15)
        at processTicksAndRejections (internal/process/task_queues.js:97:5)

I have my APOLLO_KEY in a .env file which is where the apollo tooling looks for it. I'm noticing that if I comment out my APOLLO_KEY in the .env file and rerun codegen I get the same error. Not sure if that's relevant or not.

[ardatan]

@mikefisher84 Could you enter that key by hand without using env variable?

[mikefisher84]

@ardatan boom got it! I had to make two changes.

One I had to paste the API key like you said.
However I was getting an error: "Cannot read property 'schema' of null"

Then I changed graph: service:garbanzo to graph:garbanzo and it worked.

Any idea how I can setup the APOLLO_KEY in a more sustainable way than just pasting it in the codegen.yml? Because that file will be checked into source code.

[dotansimha]

@mikefisher84 Great!
Btw, Are you using dotenv to load the environment variables? because if so, please follow: https://graphql-code-generator.com/docs/getting-started/require-field#dotenv-integration

[mikefisher84]

Awesome I'll give that a shot. Thanks for the help @ardatan and @dotansimha you guys are awesome!

[dotansimha]

Keeping this open until we'll add docs to it. Thank you for reporting it @mikefisher84 !

[dotansimha]

Let's track it here: https://github.com/dotansimha/graphql-code-generator/issues/4197