vscode-apollo 1.20.0 → 2.0.0

package/src/language-server/project/client.ts

@@ -23,9 +23,12 @@ import {
   print,
 } from "graphql";
 import { ValidationRule } from "graphql/validation/ValidationContext";
-import { NotificationHandler, DiagnosticSeverity } from "vscode-languageserver";
+import {
+  NotificationHandler,
+  DiagnosticSeverity,
+} from "vscode-languageserver/node";
 import LZString from "lz-string";
-import { stringifyUrl } from "query-string";
+import { URL } from "node:url";
 
 import { rangeForASTNode } from "../utilities/source";
 import { formatMS } from "../format";
@@ -53,8 +56,8 @@ import {
   DiagnosticSet,
   diagnosticsFromError,
 } from "../diagnostics";
-import URI from "vscode-uri";
-import type { EngineDecoration } from "src/messages";
+import { URI } from "vscode-uri";
+import type { EngineDecoration } from "../../messages";
 import { join } from "path";
 
 type Maybe<T> = null | undefined | T;
@@ -65,7 +68,7 @@ function schemaHasASTNodes(schema: GraphQLSchema): boolean {
 }
 
 function augmentSchemaWithGeneratedSDLIfNeeded(
-  schema: GraphQLSchema
+  schema: GraphQLSchema,
 ): GraphQLSchema {
   if (schemaHasASTNodes(schema)) return schema;
 
@@ -74,18 +77,21 @@ function augmentSchemaWithGeneratedSDLIfNeeded(
   return buildSchema(
     // Rebuild the schema from a generated source file and attach the source to a `graphql-schema:/`
     // URI that can be loaded as an in-memory file by VS Code.
-    new Source(sdl, `graphql-schema:/schema.graphql?${encodeURIComponent(sdl)}`)
+    new Source(
+      sdl,
+      `graphql-schema:/schema.graphql?${encodeURIComponent(sdl)}`,
+    ),
   );
 }
 
 export function isClientProject(
-  project: GraphQLProject
+  project: GraphQLProject,
 ): project is GraphQLClientProject {
   return project instanceof GraphQLClientProject;
 }
 
 export interface GraphQLClientProjectConfig {
-  clientIdentity?: ClientIdentity;
+  clientIdentity: ClientIdentity;
   config: ClientConfig;
   configFolderURI: URI;
   loadingHandler: LoadingHandler;
@@ -133,7 +139,7 @@ export class GraphQLClientProject extends GraphQLProject {
         "⚠️  It looks like there are 0 files associated with this Apollo Project. " +
           "This may be because you don't have any files yet, or your includes/excludes " +
           "fields are configured incorrectly, and Apollo can't find your files. " +
-          "For help configuring Apollo projects, see this guide: https://go.apollo.dev/t/config"
+          "For help configuring Apollo projects, see this guide: https://go.apollo.dev/t/config",
       );
     }
 
@@ -203,11 +209,11 @@ export class GraphQLClientProject extends GraphQLProject {
           await this.schemaProvider.resolveSchema({
             tag: tag || this.config.variant,
             force: true,
-          })
+          }),
         );
 
         this.schema = extendSchema(this.serviceSchema, this.clientSchema);
-      })()
+      })(),
     );
   }
 
@@ -265,7 +271,7 @@ export class GraphQLClientProject extends GraphQLProject {
     visit(this.clientSchema, {
       ObjectTypeExtension(node) {
         const type = schema.getType(
-          node.name.value
+          node.name.value,
         ) as Maybe<GraphQLObjectType>;
         const { fields } = node;
         if (!fields || !type) return;
@@ -297,7 +303,7 @@ export class GraphQLClientProject extends GraphQLProject {
         if (uri) {
           diagnosticSet.addDiagnostics(
             uri,
-            diagnosticsFromError(error, DiagnosticSeverity.Error, "Validation")
+            diagnosticsFromError(error, DiagnosticSeverity.Error, "Validation"),
           );
         }
       } else {
@@ -316,8 +322,8 @@ export class GraphQLClientProject extends GraphQLProject {
             this.schema,
             document,
             fragments,
-            this._validationRules
-          )
+            this._validationRules,
+          ),
         );
       }
     }
@@ -354,7 +360,7 @@ export class GraphQLClientProject extends GraphQLProject {
         } catch (e) {
           console.error(e);
         }
-      })()
+      })(),
     );
   }
 
@@ -399,54 +405,42 @@ export class GraphQLClientProject extends GraphQLProject {
                     .join("\n\n");
                   const explorerURLState =
                     LZString.compressToEncodedURIComponent(
-                      JSON.stringify({ document })
+                      JSON.stringify({ document }),
                     );
 
                   const frontendUrlRoot =
                     this.frontendUrlRoot ?? "https://studio.apollographql.com";
 
                   const variant = this.config.variant;
-                  const graphId = this.config.graph;
+                  const graphId = this.studioGraphId;
 
-                  const { client, service } = this.config;
+                  const { client } = this.config;
                   const remoteServiceConfig =
                     typeof client.service === "object" &&
                     "url" in client.service
                       ? client.service
-                      : service?.endpoint;
+                      : undefined;
                   const endpoint = remoteServiceConfig?.url;
 
-                  const runInExplorerPath = graphId
-                    ? stringifyUrl({
-                        url: `/graph/${graphId}/explorer`,
-                        query: {
-                          variant,
-                          explorerURLState,
-                          referrer: "vscode",
-                        },
-                      })
-                    : stringifyUrl({
-                        url: "/sandbox/explorer",
-                        query: {
-                          endpoint,
-                          explorerURLState,
-                          referrer: "vscode",
-                        },
-                      });
-                  const runInExplorerLink = join(
+                  const runInExplorerLink = buildExplorerURL({
                     frontendUrlRoot,
-                    runInExplorerPath
-                  );
-
-                  decorations.push({
-                    type: "runGlyph",
-                    document: uri,
-                    range: rangeForASTNode(node),
-                    hoverMessage: `[Run in Studio](${runInExplorerLink})`,
+                    variant,
+                    explorerURLState,
+                    endpoint,
+                    graphId,
                   });
+
+                  if (runInExplorerLink) {
+                    decorations.push({
+                      type: "runGlyph",
+                      document: uri,
+                      range: rangeForASTNode(node),
+                      hoverMessage: `[Run in Studio](${runInExplorerLink})`,
+                    });
+                  }
                 }
               },
-            })
+            }),
           );
         }
       }
@@ -468,73 +462,9 @@ export class GraphQLClientProject extends GraphQLProject {
     return fragments;
   }
 
-  get operations(): { [operationName: string]: OperationDefinitionNode } {
-    const operations = Object.create(null);
-    for (const document of this.documents) {
-      if (!document.ast) continue;
-      for (const definition of document.ast.definitions) {
-        if (definition.kind === Kind.OPERATION_DEFINITION) {
-          if (!definition.name) {
-            throw new GraphQLError(
-              "Apollo does not support anonymous operations",
-              [definition]
-            );
-          }
-          operations[definition.name.value] = definition;
-        }
-      }
-    }
-    return operations;
-  }
-
-  get mergedOperationsAndFragments(): {
-    [operationName: string]: DocumentNode;
-  } {
-    return separateOperations({
-      kind: Kind.DOCUMENT,
-      definitions: [
-        ...Object.values(this.fragments),
-        ...Object.values(this.operations),
-      ],
-    });
-  }
-
-  get mergedOperationsAndFragmentsForService(): {
-    [operationName: string]: DocumentNode;
-  } {
-    const { clientOnlyDirectives, clientSchemaDirectives, addTypename } =
-      this.config.client;
-    const current = this.mergedOperationsAndFragments;
-    if (
-      (!clientOnlyDirectives || !clientOnlyDirectives.length) &&
-      (!clientSchemaDirectives || !clientSchemaDirectives.length)
-    )
-      return current;
-
-    const filtered = Object.create(null);
-    for (const operationName in current) {
-      const document = current[operationName];
-
-      let serviceOnly = removeDirectiveAnnotatedFields(
-        removeDirectives(document, clientOnlyDirectives as string[]),
-        clientSchemaDirectives as string[]
-      );
-
-      if (addTypename)
-        serviceOnly = withTypenameFieldAddedWhereNeeded(serviceOnly);
-      // In the case we've made a document empty by filtering client directives,
-      // we don't want to include that in the result we pass on.
-      if (serviceOnly.definitions.filter(Boolean).length) {
-        filtered[operationName] = serviceOnly;
-      }
-    }
-
-    return filtered;
-  }
-
   getOperationFieldsFromFieldDefinition(
     fieldName: string,
-    parent: ObjectTypeDefinitionNode | null
+    parent: ObjectTypeDefinitionNode | null,
   ): FieldNode[] {
     if (!this.schema || !parent) return [];
     const fields: FieldNode[] = [];
@@ -552,7 +482,7 @@ export class GraphQLClientProject extends GraphQLProject {
             }
             return;
           },
-        })
+        }),
       );
     }
     return fields;
@@ -573,7 +503,7 @@ export class GraphQLClientProject extends GraphQLProject {
     return fragmentSpreads;
   }
   getOperationWithFragments(
-    operationDefinition: OperationDefinitionNode
+    operationDefinition: OperationDefinitionNode,
   ): ExecutableDefinitionNode[] {
     const fragments = this.fragments;
     const seenFragmentNames = new Set<string>([]);
@@ -599,4 +529,40 @@ export class GraphQLClientProject extends GraphQLProject {
 
     return allDefinitions;
   }
+
+  private get studioGraphId() {
+    // if we don't have an `engineClient`, we are not in a studio project and `this.config.graph` could be just about anything
+    return this.engineClient ? this.config.graph : undefined;
+  }
+}
+
+function buildExplorerURL({
+  frontendUrlRoot,
+  variant,
+  explorerURLState,
+  endpoint,
+  graphId,
+}: {
+  frontendUrlRoot: string;
+  variant: string;
+  explorerURLState: string;
+  endpoint: string | undefined;
+  graphId: string | undefined;
+}) {
+  const url = new URL(
+    graphId ? `/graph/${graphId}/explorer` : "/sandbox/explorer",
+    frontendUrlRoot,
+  );
+  url.searchParams.set("explorerURLState", explorerURLState);
+  url.searchParams.set("referrer", "vscode");
+  if (graphId) {
+    url.searchParams.set("variant", variant);
+  } else if (endpoint) {
+    url.searchParams.set("endpoint", endpoint);
+  } else {
+    // we don't know a graphId or endpoint, so we can't build a URL
+    // in that case, we don't want to show a broken 'Run in explorer' gutter link
+    return null;
+  }
+  return url.toString();
 }

package/src/language-server/project/defaultClientSchema.ts

@@ -8,14 +8,14 @@ Direct the client to resolve this field locally, either from the cache or local
 directive @client(
   """
   When true, the client will never use the cache for this value. See
-  https://www.apollographql.com/docs/react/essentials/local-state/#forcing-resolvers-with-clientalways-true
+  https://www.apollographql.com/docs/react/local-state/local-resolvers/#forcing-resolvers-with-clientalways-true
   """
   always: Boolean
 ) on FIELD | FRAGMENT_DEFINITION | INLINE_FRAGMENT
 
 """
 Export this locally resolved field as a variable to be used in the remainder of this query. See
-https://www.apollographql.com/docs/react/essentials/local-state/#using-client-fields-as-variables
+https://www.apollographql.com/docs/react/local-state/local-resolvers/#using-client-fields-as-variables
 """
 directive @export(
   """
@@ -26,7 +26,7 @@ directive @export(
 
 """
 Specify a custom store key for this result. See
-https://www.apollographql.com/docs/react/advanced/caching/#the-connection-directive
+https://www.apollographql.com/docs/react/caching/advanced-topics/#the-connection-directive
 """
 directive @connection(
   """
@@ -38,8 +38,33 @@ directive @connection(
   """
   filter: [String!]
 ) on FIELD
+
+"""
+The @nonreactive directive can be used to mark query fields or fragment spreads and is used to indicate that changes to the data contained within the subtrees marked @nonreactive should not trigger rerendering.
+This allows parent components to fetch data to be rendered by their children without rerendering themselves when the data corresponding with fields marked as @nonreactive change.
+https://www.apollographql.com/docs/react/data/directives#nonreactive
+"""
+directive @nonreactive on FIELD
+
+"""
+This directive enables your queries to receive data for specific fields incrementally, instead of receiving all field data at the same time.
+This is helpful whenever some fields in a query take much longer to resolve than others.
+https://www.apollographql.com/docs/react/data/directives#defer
+"""
+directive @defer(
+  """
+  When true fragment may be deferred, if omitted defaults to true.
+  """
+  if: Boolean
+  """
+  A unique label across all @defer and @stream directives in an operation.
+  This label should be used by GraphQL clients to identify the data from patch responses and associate it with the correct fragment.
+  If provided, the GraphQL Server must add it to the payload.
+  """
+  label: String
+) on FRAGMENT_SPREAD | INLINE_FRAGMENT
 `;
 
 export const apolloClientSchemaDocument = new GraphQLDocument(
-  new Source(apolloClientSchema)
+  new Source(apolloClientSchema),
 );

package/src/language-server/providers/schema/__tests__/file.ts

@@ -2,13 +2,14 @@ import { FileSchemaProvider } from "../file";
 import * as path from "path";
 import * as fs from "fs";
 import { Debug } from "../../../utilities";
+import { URI } from "vscode-uri";
 
 const makeNestedDir = (dir: string) => {
   if (fs.existsSync(dir)) return;
 
   try {
     fs.mkdirSync(dir);
-  } catch (err) {
+  } catch (err: any) {
     if (err.code == "ENOENT") {
       makeNestedDir(path.dirname(dir)); //create parent dir
       makeNestedDir(dir); //create dir
@@ -77,9 +78,12 @@ describe("FileSchemaProvider", () => {
         `,
       });
 
-      const provider = new FileSchemaProvider({
-        path: dir + "/schema.graphql",
-      });
+      const provider = new FileSchemaProvider(
+        {
+          path: "./schema.graphql",
+        },
+        URI.from({ scheme: "file", path: dirPath }),
+      );
       const sdl = await provider.resolveFederatedServiceSDL();
       expect(sdl).toMatchInlineSnapshot;
     });
@@ -102,23 +106,57 @@ describe("FileSchemaProvider", () => {
           }`,
       });
 
-      const provider = new FileSchemaProvider({
-        paths: [dir + "/schema.graphql", dir + "/schema2.graphql"],
-      });
+      const provider = new FileSchemaProvider(
+        {
+          paths: ["schema.graphql", "schema2.graphql"],
+        },
+        URI.from({ scheme: "file", path: dirPath }),
+      );
       const sdl = await provider.resolveFederatedServiceSDL();
       expect(sdl).toMatchInlineSnapshot(`
-        "type Product @key(fields: \\"id\\") {
-          id: ID
-          sku: ID
-          name: String
-          weight: Float
-        }
+"directive @key(fields: _FieldSet!, resolvable: Boolean = true) repeatable on OBJECT | INTERFACE
 
-        extend type Query {
-          myProduct: Product
-        }
-        "
-      `);
+directive @requires(fields: _FieldSet!) on FIELD_DEFINITION
+
+directive @provides(fields: _FieldSet!) on FIELD_DEFINITION
+
+directive @external(reason: String) on OBJECT | FIELD_DEFINITION
+
+directive @tag(name: String!) repeatable on FIELD_DEFINITION | OBJECT | INTERFACE | UNION | ARGUMENT_DEFINITION | SCALAR | ENUM | ENUM_VALUE | INPUT_OBJECT | INPUT_FIELD_DEFINITION
+
+directive @extends on OBJECT | INTERFACE
+
+type Query {
+  _entities(representations: [_Any!]!): [_Entity]!
+  _service: _Service!
+}
+
+extend type Query {
+  myProduct: Product
+}
+
+type Product
+  @key(fields: \\"id\\")
+{
+  id: ID
+  sku: ID
+  name: String
+}
+
+extend type Product {
+  weight: Float
+}
+
+scalar _FieldSet
+
+scalar _Any
+
+type _Service {
+  sdl: String
+}
+
+union _Entity = Product"
+`);
     });
 
     it("errors when sdl file is not a graphql file", async () => {
@@ -142,7 +180,10 @@ describe("FileSchemaProvider", () => {
       const errorSpy = jest.spyOn(Debug, "error");
       errorSpy.mockImplementation(() => {});
 
-      const provider = new FileSchemaProvider({ path: dir + "/schema.js" });
+      const provider = new FileSchemaProvider(
+        { path: "./schema.js" },
+        URI.from({ scheme: "file", path: dirPath }),
+      );
       const sdl = await provider.resolveFederatedServiceSDL();
       expect(errorSpy).toBeCalledTimes(2);
     });

package/src/language-server/providers/schema/base.ts

@@ -1,5 +1,5 @@
 import { GraphQLSchema } from "graphql";
-import { NotificationHandler } from "vscode-languageserver";
+import { NotificationHandler } from "vscode-languageserver/node";
 
 export interface SchemaResolveConfig {
   tag?: string;
@@ -9,7 +9,7 @@ export type SchemaChangeUnsubscribeHandler = () => void;
 export interface GraphQLSchemaProvider {
   resolveSchema(config?: SchemaResolveConfig): Promise<GraphQLSchema>;
   onSchemaChange(
-    handler: NotificationHandler<GraphQLSchema>
+    handler: NotificationHandler<GraphQLSchema>,
   ): SchemaChangeUnsubscribeHandler;
   resolveFederatedServiceSDL(): Promise<string | void>;
 }

package/src/language-server/providers/schema/endpoint.ts

@@ -1,7 +1,9 @@
 // IntrospectionSchemaProvider (http => IntrospectionResult => schema)
-import { NotificationHandler } from "vscode-languageserver";
-import { execute as linkExecute, toPromise } from "apollo-link";
-import { createHttpLink, HttpLink } from "apollo-link-http";
+import { NotificationHandler } from "vscode-languageserver/node";
+
+import { execute as linkExecute } from "@apollo/client/link/core";
+import { toPromise } from "@apollo/client/link/utils";
+import { createHttpLink, HttpOptions } from "@apollo/client/link/http";
 import {
   GraphQLSchema,
   buildClientSchema,
@@ -11,8 +13,7 @@ import {
   parse,
 } from "graphql";
 import { Agent as HTTPSAgent } from "https";
-import { fetch } from "../../../env";
-import { RemoteServiceConfig, DefaultServiceConfig } from "../../config";
+import { RemoteServiceConfig } from "../../config";
 import { GraphQLSchemaProvider, SchemaChangeUnsubscribeHandler } from "./base";
 import { Debug } from "../../utilities";
 import { isString } from "util";
@@ -25,9 +26,8 @@ export class EndpointSchemaProvider implements GraphQLSchemaProvider {
   async resolveSchema() {
     if (this.schema) return this.schema;
     const { skipSSLValidation, url, headers } = this.config;
-    const options: HttpLink.Options = {
+    const options: HttpOptions = {
       uri: url,
-      fetch,
     };
     if (url.startsWith("https:") && skipSSLValidation) {
       options.fetchOptions = {
@@ -39,7 +39,7 @@ export class EndpointSchemaProvider implements GraphQLSchemaProvider {
       linkExecute(createHttpLink(options), {
         query: parse(getIntrospectionQuery()),
         context: { headers },
-      })
+      }),
     ).catch((e) => {
       // html response from introspection
       if (isString(e.message) && e.message.includes("token <")) {
@@ -51,35 +51,16 @@ export class EndpointSchemaProvider implements GraphQLSchemaProvider {
             "-----------------------------\n" +
             "For more information, please refer to: https://go.apollo.dev/t/config \n\n" +
             "The following error occurred:\n-----------------------------\n" +
-            e.message
+            e.message,
         );
       }
 
-      // 404 encountered with the default url
-      if (
-        url === DefaultServiceConfig.endpoint.url &&
-        isString(e.message) &&
-        e.message.includes("ECONNREFUSED")
-      ) {
-        throw new Error(
-          "Failed to connect to a running GraphQL endpoint at " +
-            url +
-            "\nThis may be because you didn't start your service.\n" +
-            "By default, when an endpoint, Apollo API key, or localSchemaFile isn't provided, Apollo tries to fetch a schema from " +
-            DefaultServiceConfig.endpoint.url +
-            "\n-----------------------------\n" +
-            "\nFor more information, please refer to: https://go.apollo.dev/t/config \n\n" +
-            "The following error occurred: \n" +
-            "-----------------------------\n" +
-            e.message
-        );
-      }
       // 404 with a non-default url
       if (isString(e.message) && e.message.includes("ECONNREFUSED")) {
         throw new Error(
           "Failed to connect to a running GraphQL endpoint at " +
             url +
-            "\nThis may be because you didn't start your service or the endpoint URL is incorrect."
+            "\nThis may be because you didn't start your service or the endpoint URL is incorrect.",
         );
       }
       throw new Error(e);
@@ -99,7 +80,7 @@ export class EndpointSchemaProvider implements GraphQLSchemaProvider {
   }
 
   onSchemaChange(
-    _handler: NotificationHandler<GraphQLSchema>
+    _handler: NotificationHandler<GraphQLSchema>,
   ): SchemaChangeUnsubscribeHandler {
     throw new Error("Polling of endpoint not implemented yet");
     return () => {};
@@ -109,7 +90,7 @@ export class EndpointSchemaProvider implements GraphQLSchemaProvider {
     if (this.federatedServiceSDL) return this.federatedServiceSDL;
 
     const { skipSSLValidation, url, headers } = this.config;
-    const options: HttpLink.Options = {
+    const options: HttpOptions = {
       uri: url,
       fetch,
     };
@@ -131,18 +112,18 @@ export class EndpointSchemaProvider implements GraphQLSchemaProvider {
       linkExecute(createHttpLink(options), {
         query: parse(getFederationInfoQuery),
         context: { headers },
-      })
+      }),
     )) as ExecutionResult<{ _service: { sdl: string } }>;
 
     if (errors && errors.length) {
       return Debug.error(
-        errors.map(({ message }: Error) => message).join("\n")
+        errors.map(({ message }: Error) => message).join("\n"),
       );
     }
 
     if (!data || !data._service) {
       return Debug.error(
-        "No data received from server when querying for _service."
+        "No data received from server when querying for _service.",
       );
     }