Add gql editor support: autocomplete / quick infos / go to definitions (

#40)

* add gql quick infos

* add quick-infos test

* add gql auto-complete with test

* add gql go to definitions

* improve get definition and bound span
add tests

* improve definition coverage

* update README

* upgrade to 1.5.0

README.md

@@ -8,6 +8,16 @@ A [TypeScript Language Service Plugin](https://github.com/Microsoft/TypeScript/w
 
 <img src="https://raw.githubusercontent.com/chnapy/ts-gql-plugin/master/.github/images/example.gif" alt="ts-gql-plugin example" />
 
+---
+
+- :triangular_ruler: Typed GraphQL operations
+- :x: No code generation
+- :toolbox: [CLI support](#cli)
+- :pencil: Editor support with autocomplete / quick-infos / "go to definition"
+- :link: Multi-projects support
+
+---
+
 Using `gql` from `graphql-tag` gives you generic `DocumentNode` type, which does not allow you to manipulate typed requested data when used with Apollo for example. To resolve that you can use [code generators](https://www.graphql-code-generator.com/) creating typescript code with correct types, but it adds lot of generated code with risk of obsolete code and bad development comfort.
 
 `ts-gql-plugin` is meant to solve this issue, by replacing most of code generation by compiler-side typing, using [TypeScript Language Service Plugin](https://github.com/Microsoft/TypeScript/wiki/Writing-a-Language-Service-Plugin).
@@ -287,7 +297,6 @@ gql`
 
 - since Language Service feature is limited concerning types overriding, solution was to parse & override text source files during TS server process, which is subobtimal for performances (best solution would have been to work with AST)
 - as described upper, CLI is not handled out-of-box because of `tsc` design limitations
-- because TypeScript compiler does not handle async operations, required by some dependencies, so use of [`deasync`](https://github.com/abbr/deasync) is required
 
 ## Benchmark
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ts-gql-plugin",
-  "version": "1.4.2",
+  "version": "1.5.0",
   "packageManager": "yarn@3.2.1",
   "license": "MIT",
   "main": "./dist/index.js",
@@ -43,7 +43,9 @@
     "@graphql-codegen/typescript-operations": "2.3.7",
     "@graphql-tools/graphql-tag-pluck": "7.3.3",
     "deasync": "0.1.26",
-    "graphql-config": "4.3.1"
+    "graphql-config": "4.3.5",
+    "graphql-language-service": "5.0.6",
+    "graphql-language-service-utils": "2.7.1"
   },
   "peerDependencies": {
     "graphql": ">= 16",

src/cached/cached-document-schema-loader.ts

@@ -0,0 +1,124 @@
+import { DocumentNode } from 'graphql';
+import path from 'node:path';
+import { ErrorCatcher } from '../create-error-catcher';
+import { ExtensionConfig } from '../extension-config';
+import { generateTypeFromSchema } from '../generators/generate-type-from-schema';
+import { getProjectExtension } from '../source-update/extension';
+import {
+  CacheItem,
+  checkFileLastUpdate,
+  createCacheSystem,
+} from '../utils/cache-system';
+import { CachedGraphQLConfigLoader } from './cached-graphql-config-loader';
+
+export type CreateCachedSchemaLoaderOptions = {
+  cachedGraphQLConfigLoader: CachedGraphQLConfigLoader;
+  errorCatcher: ErrorCatcher;
+};
+
+export type SchemaProjectInfos<D> = {
+  schemaFilePath?: string;
+  schemaDocument: D;
+};
+
+type ProjectInfos = SchemaProjectInfos<DocumentNode> & {
+  staticGlobals: string[];
+  extension: ExtensionConfig;
+};
+
+type CachedDocumentSchemaLoaderValue = ProjectInfos | null;
+
+export type CachedSchemaLoaderInput = {
+  projectName: string;
+};
+
+export type CachedDocumentSchemaLoader = ReturnType<
+  typeof createCachedDocumentSchemaLoader
+>;
+
+export const defaultProjectName = 'default';
+
+export const getProjectNameIfNotDefault = (projectName: string) =>
+  projectName === defaultProjectName ? undefined : projectName;
+
+export const getCreateProjectInfos = async (
+  cachedGraphQLConfigLoader: CachedGraphQLConfigLoader,
+  { projectName }: CachedSchemaLoaderInput
+) => {
+  const { graphqlProjects } = await cachedGraphQLConfigLoader.getItemOrCreate(
+    null
+  );
+
+  const project = graphqlProjects.find(({ name }) => name === projectName);
+  if (!project) {
+    throw new Error(`Project not defined for name "${projectName}"`);
+  }
+
+  const schemaFilePath =
+    typeof project.schema === 'string'
+      ? path.join(project.dirpath, project.schema)
+      : undefined;
+
+  return {
+    project,
+    schemaFilePath,
+  };
+};
+
+export const getCachedSchemaCheckValidity =
+  (cachedGraphQLConfigLoader: CachedGraphQLConfigLoader) =>
+  async (
+    currentItem: CacheItem<SchemaProjectInfos<unknown> | null, unknown>
+  ) => {
+    const isGraphQLConfigValid =
+      await cachedGraphQLConfigLoader.checkItemValidity(null);
+    if (!isGraphQLConfigValid) {
+      return false;
+    }
+
+    const project = await currentItem.value;
+    if (!project) {
+      return true;
+    }
+
+    if (!project.schemaFilePath) {
+      return false;
+    }
+
+    return checkFileLastUpdate(project.schemaFilePath, currentItem.dateTime);
+  };
+
+export const createCachedDocumentSchemaLoader = ({
+  cachedGraphQLConfigLoader,
+  errorCatcher,
+}: CreateCachedSchemaLoaderOptions) =>
+  createCacheSystem<CachedDocumentSchemaLoaderValue, CachedSchemaLoaderInput>({
+    // TODO debounce
+    // debounceValue: 1000,
+    getKeyFromInput: (input) => input.projectName,
+    create: async (input) => {
+      const { project, schemaFilePath } = await getCreateProjectInfos(
+        cachedGraphQLConfigLoader,
+        input
+      );
+
+      const extension = getProjectExtension(project);
+
+      return project
+        .getSchema('DocumentNode')
+        .then(
+          async (schemaDocument): Promise<ProjectInfos> => ({
+            schemaFilePath,
+            schemaDocument,
+            staticGlobals: await generateTypeFromSchema(
+              schemaDocument,
+              getProjectNameIfNotDefault(input.projectName),
+              extension.codegenConfig
+            ),
+            extension,
+          })
+        )
+        .catch(errorCatcher);
+    },
+    checkValidity: getCachedSchemaCheckValidity(cachedGraphQLConfigLoader),
+  });

src/cached/cached-graphql-config-loader.ts

@@ -1,4 +1,8 @@
-import { GraphQLProjectConfig, loadConfig } from 'graphql-config';
+import {
+  GraphQLConfig,
+  GraphQLProjectConfig,
+  loadConfig,
+} from 'graphql-config';
 import { tsGqlExtension } from '../source-update/extension';
 import { checkFileLastUpdate, createCacheSystem } from '../utils/cache-system';
 import { Logger } from '../utils/logger';
@@ -12,6 +16,7 @@ type CreateCachedGraphQLConfigLoaderOptions = {
 
 type CachedGraphQLConfigLoaderValue = {
   configFilePath: string;
+  graphqlConfig: GraphQLConfig;
   graphqlProjects: GraphQLProjectConfig[];
 };
 
@@ -59,7 +64,11 @@ export const createCachedGraphQLConfigLoader = ({
         logger.log(`GraphQL project "${name}" schema loaded from ${schema}`)
       );
 
-      return { configFilePath: graphqlConfig.filepath, graphqlProjects };
+      return {
+        configFilePath: graphqlConfig.filepath,
+        graphqlConfig,
+        graphqlProjects,
+      };
     },
     checkValidity: async (currentItem) => {
       const { configFilePath } = await currentItem.value;

src/cached/cached-graphql-schema-loader.ts

@@ -0,0 +1,39 @@
+import { GraphQLSchema } from 'graphql';
+import { createCacheSystem } from '../utils/cache-system';
+import {
+  CachedSchemaLoaderInput,
+  CreateCachedSchemaLoaderOptions,
+  getCachedSchemaCheckValidity,
+  getCreateProjectInfos,
+  SchemaProjectInfos,
+} from './cached-document-schema-loader';
+
+type CachedSchemaLoaderValue = SchemaProjectInfos<GraphQLSchema> | null;
+
+export type CachedGraphQLSchemaLoader = ReturnType<
+  typeof createCachedGraphQLSchemaLoader
+>;
+
+export const createCachedGraphQLSchemaLoader = ({
+  cachedGraphQLConfigLoader,
+  errorCatcher,
+}: CreateCachedSchemaLoaderOptions) =>
+  createCacheSystem<CachedSchemaLoaderValue, CachedSchemaLoaderInput>({
+    getKeyFromInput: (input) => input.projectName,
+    create: async (input) => {
+      const { project, schemaFilePath } = await getCreateProjectInfos(
+        cachedGraphQLConfigLoader,
+        input
+      );
+
+      return project
+        .getSchema('GraphQLSchema')
+        .then(async (schemaDocument) => ({
+          schemaFilePath,
+          schemaDocument,
+        }))
+        .catch(errorCatcher);
+    },
+    checkValidity: getCachedSchemaCheckValidity(cachedGraphQLConfigLoader),
+    sizeLimit: 40,
+  });

src/cached/cached-literal-parser.ts

@@ -4,13 +4,13 @@ import { generateTypeFromLiteral } from '../generators/generate-type-from-litera
 import { DocumentInfos } from '../generators/generate-bottom-content';
 import { createCacheSystem } from '../utils/cache-system';
 import {
-  CachedSchemaLoader,
+  CachedDocumentSchemaLoader,
   defaultProjectName,
   getProjectNameIfNotDefault,
-} from './cached-schema-loader';
+} from './cached-document-schema-loader';
 
 type CreateCachedLiteralParserOptions = {
-  cachedSchemaLoader: CachedSchemaLoader;
+  cachedDocumentSchemaLoader: CachedDocumentSchemaLoader;
   projectNameRegex: string | undefined;
   errorCatcher: ErrorCatcher;
 };
@@ -28,20 +28,23 @@ type CachedLiteralParserInput = {
 
 export type CachedLiteralParser = ReturnType<typeof createCachedLiteralParser>;
 
+export const getProjectNameFromLiteral = (
+  literal: string,
+  projectNameRegex: string | undefined
+) =>
+  projectNameRegex
+    ? (new RegExp(projectNameRegex).exec(literal) ?? [])[0]
+    : defaultProjectName;
+
 export const createCachedLiteralParser = ({
-  cachedSchemaLoader,
+  cachedDocumentSchemaLoader,
   projectNameRegex,
   errorCatcher,
 }: CreateCachedLiteralParserOptions) => {
-  const getProjectNameFromLiteral = (literal: string) =>
-    projectNameRegex
-      ? (new RegExp(projectNameRegex).exec(literal) ?? [])[0]
-      : defaultProjectName;
-
   const getProjectFromLiteral = async (literal: string) => {
-    const projectName = getProjectNameFromLiteral(literal);
+    const projectName = getProjectNameFromLiteral(literal, projectNameRegex);
 
-    const project = await cachedSchemaLoader.getItemOrCreate({
+    const project = await cachedDocumentSchemaLoader.getItemOrCreate({
       projectName,
     });
     if (!project) {
@@ -82,9 +85,12 @@ export const createCachedLiteralParser = ({
       }
     },
     checkValidity: async ({ input }) => {
-      const projectName = getProjectNameFromLiteral(input.literal);
+      const projectName = getProjectNameFromLiteral(
+        input.literal,
+        projectNameRegex
+      );
 
-      return await cachedSchemaLoader.checkItemValidity({
+      return await cachedDocumentSchemaLoader.checkItemValidity({
         projectName,
       });
     },