Skip to content

Draft: Add types to one graphql query

Kev Kloss requested to merge kkloss-add-types-to-one-graphql-query into master

What does this MR do and why?

This is a demo that adds opt-in static type-checking to GraphQL queries in the frontend. The goal is that we can statically check that data is used correctly, and contributors can use data more confidently.

For example, whenever I work in a JavaScript codebase that has no static typing (JSDoc, TypeScript, Flow, ...), my brain is very focused on e.g. using the correct variables, whereas I shouldn’t have to spend time and energy thinking about that if the typing is technically available (in the GraphQL schema!).

This would also allow us to statically lint files, so accessing data that’s not present, which would get us a lot of quality checks without writing miles of tests.

Blockers

Please note that this MR is a hot fluffin’ mess. Here are a few rough TODOs we’d have to solve to bring this anywhere near reviewable, in random order:

  1. Rename GraphQL fragments that have the same name (two or more fragments with the same name mean we can’t generate valid type docs),
  2. Figure out how to apply this validation conditionally, so that not every error or variable is strictly checked,
  3. Deal with @deprecated fields that have the same name,
  4. Generate global GraphqlQueries based on the queries,
  5. What’s the implication of using a tsconfig.json,
  6. Generate app/assets/javascripts/graphql_shared/types.d.ts locally instead of committing it to the repo,
  7. Optional: can we minimize the amount of types generated for types.d.ts (right now it’s 4736),
  8. etc etc...

Screenshots

Example Error
image image
Edited by Kev Kloss

Merge request reports

Loading