vscode-apollo 1.19.3 → 1.20.1

package/src/language-server/errors/__tests__/NoMissingClientDirectives.test.ts

@@ -0,0 +1,220 @@
+import { NoMissingClientDirectives } from "../validation";
+import { GraphQLClientProject } from "../../project/client";
+import { basename } from "path";
+
+import { vol } from "memfs";
+import { LoadingHandler } from "../../loadingHandler";
+import { ApolloConfig, ClientConfig } from "../../config";
+import URI from "vscode-uri";
+
+const serviceSchema = /* GraphQL */ `
+  type Query {
+    me: User
+  }
+
+  type User {
+    name: String
+    friends: [User]
+  }
+`;
+const clientSchema = /* GraphQL */ `
+  extend type Query {
+    isOnline: Boolean
+  }
+  extend type User {
+    isLiked: Boolean
+    localUser: User
+  }
+`;
+const a = /* GraphQL */ `
+  query a {
+    isOnline
+    me {
+      name
+      foo # added field missing in service schema to ensure it doesn't throw, see https://github.com/apollographql/vscode-graphql/pull/73
+      localUser @client {
+        friends {
+          isLiked
+        }
+      }
+      friends {
+        name
+        isLiked
+      }
+    }
+  }
+`;
+
+const b = /* GraphQL */ `
+  query b {
+    me {
+      ... {
+        isLiked
+      }
+      ... @client {
+        localUser {
+          name
+        }
+      }
+    }
+  }
+`;
+
+const c = /* GraphQL */ `
+  query c {
+    me {
+      ...isLiked
+    }
+  }
+  fragment localUser on User @client {
+    localUser {
+      name
+    }
+  }
+  fragment isLiked on User {
+    isLiked
+    ...localUser
+  }
+`;
+
+const d = /* GraphQL */ `
+  fragment isLiked on User {
+    isLiked
+  }
+  query d {
+    me {
+      ...isLiked
+      ...locaUser
+    }
+  }
+  fragment localUser on User @client {
+    localUser {
+      name
+    }
+  }
+`;
+
+const e = /* GraphQL */ `
+  fragment friends on User {
+    friends {
+      ...isLiked
+      ... on User @client {
+        localUser {
+          name
+        }
+      }
+    }
+  }
+  query e {
+    isOnline @client
+    me {
+      ...friends
+    }
+  }
+  fragment isLiked on User {
+    isLiked
+  }
+`;
+
+// TODO support inline fragment spreads
+const f = /* GraphQL */ `
+  query f {
+    me {
+      ...isLiked @client
+    }
+  }
+  fragment isLiked on User {
+    isLiked
+  }
+`;
+
+const rootURI = URI.file(process.cwd());
+
+const config = new ApolloConfig({
+  client: {
+    service: {
+      name: "server",
+      localSchemaFile: "./schema.graphql",
+    },
+    includes: ["./src/**.graphql"],
+    excludes: ["./__tests__"],
+    validationRules: [NoMissingClientDirectives],
+  },
+  engine: {},
+}) as ClientConfig;
+
+class MockLoadingHandler implements LoadingHandler {
+  handle<T>(_message: string, value: Promise<T>): Promise<T> {
+    return value;
+  }
+  handleSync<T>(_message: string, value: () => T): T {
+    return value();
+  }
+  showError(_message: string): void {}
+}
+
+jest.mock("fs");
+
+describe("client state", () => {
+  beforeEach(() => {
+    vol.fromJSON({
+      "apollo.config.js": `module.exports = {
+            client: {
+                service: {
+                    localSchemaFile: './schema.graphql'
+                }
+            }
+        }`,
+      "schema.graphql": serviceSchema,
+      "src/client-schema.graphql": clientSchema,
+      "src/a.graphql": a,
+      "src/b.graphql": b,
+      "src/c.graphql": c,
+      "src/d.graphql": d,
+      "src/e.graphql": e,
+      // "src/f.graphql": f,
+    });
+  });
+  afterEach(jest.restoreAllMocks);
+
+  it("should report validation errors for missing @client directives", async () => {
+    const project = new GraphQLClientProject({
+      config,
+      loadingHandler: new MockLoadingHandler(),
+      configFolderURI: rootURI,
+    });
+
+    const errors = Object.create(null);
+    project.onDiagnostics(({ diagnostics, uri }) => {
+      const path = basename(URI.parse(uri).path);
+      diagnostics.forEach(({ error }: any) => {
+        if (!errors[path]) errors[path] = [];
+        errors[path].push(error);
+      });
+    });
+
+    await project.whenReady;
+    await project.validate();
+
+    expect(errors).toMatchInlineSnapshot(`
+      Object {
+        "a.graphql": Array [
+          [GraphQLError: @client directive is missing on local field "isOnline"],
+          [GraphQLError: @client directive is missing on local field "isLiked"],
+        ],
+        "b.graphql": Array [
+          [GraphQLError: @client directive is missing on fragment around local fields "isLiked"],
+        ],
+        "c.graphql": Array [
+          [GraphQLError: @client directive is missing on fragment "isLiked" around local fields "isLiked,localUser"],
+        ],
+        "d.graphql": Array [
+          [GraphQLError: @client directive is missing on fragment "isLiked" around local fields "isLiked"],
+        ],
+        "e.graphql": Array [
+          [GraphQLError: @client directive is missing on fragment "isLiked" around local fields "isLiked"],
+        ],
+      }
+    `);
+  });
+});

package/src/language-server/errors/logger.ts

@@ -0,0 +1,58 @@
+import { GraphQLError } from "graphql";
+import path from "path";
+
+// ToolError is used for errors that are part of the expected flow
+// and for which a stack trace should not be printed
+
+export class ToolError extends Error {
+  name: string = "ToolError";
+
+  constructor(message: string) {
+    super(message);
+    this.message = message;
+  }
+}
+
+const isRunningFromXcodeScript = process.env.XCODE_VERSION_ACTUAL;
+
+export function logError(error: Error) {
+  if (error instanceof ToolError) {
+    logErrorMessage(error.message);
+  } else if (error instanceof GraphQLError) {
+    const fileName = error.source && error.source.name;
+    if (error.locations) {
+      for (const location of error.locations) {
+        logErrorMessage(error.message, fileName, location.line);
+      }
+    } else {
+      logErrorMessage(error.message, fileName);
+    }
+  } else {
+    console.error(error.stack);
+  }
+}
+
+export function logErrorMessage(
+  message: string,
+  fileName?: string,
+  lineNumber?: number
+) {
+  if (isRunningFromXcodeScript) {
+    if (fileName && lineNumber) {
+      // Prefixing error output with file name, line and 'error: ',
+      // so Xcode will associate it with the right file and display the error inline
+      console.error(`${fileName}:${lineNumber}: error: ${message}`);
+    } else {
+      // Prefixing error output with 'error: ', so Xcode will display it as an error
+      console.error(`error: ${message}`);
+    }
+  } else {
+    if (fileName) {
+      const truncatedFileName =
+        "/" + fileName.split(path.sep).slice(-4).join(path.sep);
+      console.error(`...${truncatedFileName}: ${message}`);
+    } else {
+      console.error(`error: ${message}`);
+    }
+  }
+}

package/src/language-server/errors/validation.ts

@@ -0,0 +1,277 @@
+import {
+  specifiedRules,
+  NoUnusedFragmentsRule,
+  GraphQLError,
+  FieldNode,
+  ValidationContext,
+  GraphQLSchema,
+  DocumentNode,
+  OperationDefinitionNode,
+  TypeInfo,
+  FragmentDefinitionNode,
+  visit,
+  visitWithTypeInfo,
+  visitInParallel,
+  getLocation,
+  InlineFragmentNode,
+  Kind,
+  isObjectType,
+} from "graphql";
+
+import { TextEdit } from "vscode-languageserver";
+
+import { ToolError, logError } from "./logger";
+import { ValidationRule } from "graphql/validation/ValidationContext";
+import { positionFromSourceLocation } from "../utilities/source";
+import {
+  buildExecutionContext,
+  ExecutionContext,
+} from "graphql/execution/execute";
+import { hasClientDirective, simpleCollectFields } from "../utilities/graphql";
+import { Debug } from "../utilities";
+
+export interface CodeActionInfo {
+  message: string;
+  edits: TextEdit[];
+}
+
+const specifiedRulesToBeRemoved = [NoUnusedFragmentsRule];
+
+export const defaultValidationRules: ValidationRule[] = [
+  NoAnonymousQueries,
+  NoTypenameAlias,
+  NoMissingClientDirectives,
+  ...specifiedRules.filter((rule) => !specifiedRulesToBeRemoved.includes(rule)),
+];
+
+export function getValidationErrors(
+  schema: GraphQLSchema,
+  document: DocumentNode,
+  fragments?: { [fragmentName: string]: FragmentDefinitionNode },
+  rules: ValidationRule[] = defaultValidationRules
+) {
+  const typeInfo = new TypeInfo(schema);
+
+  // The 4th argument to `ValidationContext` is an `onError` callback. This was
+  // introduced by https://github.com/graphql/graphql-js/pull/2074 and first
+  // published in graphql@14.5.0. It is meant to replace the `getErrors` method
+  // which was previously used. Since we support versions of graphql older than
+  // that, it's possible that this callback will not be invoked and we'll need
+  // to resort to using `getErrors`. Therefore, although we'll collect errors
+  // via this callback, if `getErrors` is present on the context we create,
+  // we'll go ahead and use that instead.
+  const errors: GraphQLError[] = [];
+  const onError = (err: GraphQLError) => errors.push(err);
+  const context = new ValidationContext(schema, document, typeInfo, onError);
+
+  if (fragments) {
+    (context as any)._fragments = fragments;
+  }
+
+  const visitors = rules.map((rule) => rule(context));
+  // Visit the whole document with each instance of all provided rules.
+  visit(document, visitWithTypeInfo(typeInfo, visitInParallel(visitors)));
+
+  // @ts-ignore
+  // `getErrors` is gone in `graphql@15`, but we still support older versions.
+  if (typeof context.getErrors === "function") return context.getErrors();
+
+  // If `getErrors` doesn't exist, we must be on a `graphql@15` or higher,
+  // so we'll use the errors we collected via the `onError` callback.
+  return errors;
+}
+
+export function validateQueryDocument(
+  schema: GraphQLSchema,
+  document: DocumentNode
+) {
+  try {
+    const validationErrors = getValidationErrors(schema, document);
+    if (validationErrors && validationErrors.length > 0) {
+      for (const error of validationErrors) {
+        logError(error);
+      }
+      return Debug.error("Validation of GraphQL query document failed");
+    }
+  } catch (e) {
+    console.error(e);
+    throw e;
+  }
+}
+
+export function NoAnonymousQueries(context: ValidationContext) {
+  return {
+    OperationDefinition(node: OperationDefinitionNode) {
+      if (!node.name) {
+        context.reportError(
+          new GraphQLError("Apollo does not support anonymous operations", [
+            node,
+          ])
+        );
+      }
+      return false;
+    },
+  };
+}
+
+export function NoTypenameAlias(context: ValidationContext) {
+  return {
+    Field(node: FieldNode) {
+      const aliasName = node.alias && node.alias.value;
+      if (aliasName == "__typename") {
+        context.reportError(
+          new GraphQLError(
+            "Apollo needs to be able to insert __typename when needed, please do not use it as an alias",
+            [node]
+          )
+        );
+      }
+    },
+  };
+}
+
+function hasClientSchema(schema: GraphQLSchema): boolean {
+  const query = schema.getQueryType();
+  const mutation = schema.getMutationType();
+  const subscription = schema.getSubscriptionType();
+
+  return Boolean(
+    (query && query.clientSchema) ||
+      (mutation && mutation.clientSchema) ||
+      (subscription && subscription.clientSchema)
+  );
+}
+
+export function NoMissingClientDirectives(context: ValidationContext) {
+  const root = context.getDocument();
+  const schema = context.getSchema();
+  // early return if we don't have any client fields on the schema
+  if (!hasClientSchema(schema)) return {};
+
+  // this isn't really execution context, but it does group the fragments and operations
+  // together correctly
+  // XXX we have a simplified version of this in @apollo/gateway that we could probably use
+  // intead of this
+  const executionContext = buildExecutionContext(
+    schema,
+    root,
+    Object.create(null),
+    Object.create(null),
+    undefined,
+    undefined,
+    undefined
+  );
+  function visitor(
+    node: FieldNode | InlineFragmentNode | FragmentDefinitionNode
+  ) {
+    // In cases where we are looking at a FragmentDefinition, there is no parent type
+    // but instead, the FragmentDefinition contains the type that we can read from the
+    // schema
+    const parentType =
+      node.kind === Kind.FRAGMENT_DEFINITION
+        ? schema.getType(node.typeCondition.name.value)
+        : context.getParentType();
+
+    const fieldDef = context.getFieldDef();
+
+    // if we don't have a type to check then we can early return
+    if (!parentType) return;
+
+    // here we collect all of the fields on a type that are marked "local"
+    const clientFields =
+      parentType &&
+      isObjectType(parentType) &&
+      parentType.clientSchema &&
+      parentType.clientSchema.localFields;
+
+    // XXXX in the case of a fragment spread, the directive could be on the fragment definition
+    let clientDirectivePresent = hasClientDirective(node);
+
+    let message = "@client directive is missing on ";
+    let selectsClientFieldSet = false;
+    switch (node.kind) {
+      case Kind.FIELD:
+        // fields are simple because we can just see if the name exists in the local fields
+        // array on the parent type
+        selectsClientFieldSet = Boolean(
+          clientFields && clientFields.includes(fieldDef?.name || "")
+        );
+        message += `local field "${node.name.value}"`;
+        break;
+      case Kind.INLINE_FRAGMENT:
+      case Kind.FRAGMENT_DEFINITION:
+        // XXX why isn't this type checking below?
+        if (Array.isArray(executionContext)) break;
+
+        const fields = simpleCollectFields(
+          executionContext as ExecutionContext,
+          node.selectionSet,
+          Object.create(null),
+          Object.create(null)
+        );
+
+        // once we have a list of fields on the fragment, we can compare them
+        // to the list of types. The fields within a fragment need to be a
+        // subset of the overall local fields types
+        const fieldNames = Object.entries(fields).map(([name]) => name);
+        selectsClientFieldSet = fieldNames.every(
+          (field) => clientFields && clientFields.includes(field)
+        );
+        message += `fragment ${
+          "name" in node ? `"${node.name.value}" ` : ""
+        }around local fields "${fieldNames.join(",")}"`;
+        break;
+    }
+
+    // if the field's parent is part of the client schema and that type
+    // includes a field with the same name as this node, we can see
+    // if it has an @client directive to resolve locally
+    if (selectsClientFieldSet && !clientDirectivePresent) {
+      let extensions: { [key: string]: any } | null = null;
+      const name = "name" in node && node.name;
+      // TODO support code actions for inline fragments, fragment spreads, and fragment definitions
+      if (name && name.loc) {
+        let { source, end: locToInsertDirective } = name.loc;
+        if (
+          "arguments" in node &&
+          node.arguments &&
+          node.arguments.length !== 0
+        ) {
+          // must insert directive after field arguments
+          const endOfArgs = source.body.indexOf(")", locToInsertDirective);
+          locToInsertDirective = endOfArgs + 1;
+        }
+        const codeAction: CodeActionInfo = {
+          message: `Add @client directive to "${name.value}"`,
+          edits: [
+            TextEdit.insert(
+              positionFromSourceLocation(
+                source,
+                getLocation(source, locToInsertDirective)
+              ),
+              " @client"
+            ),
+          ],
+        };
+        extensions = { codeAction };
+      }
+
+      context.reportError(
+        new GraphQLError(message, [node], null, null, null, null, extensions)
+      );
+    }
+
+    // if we have selected a client field, no need to continue to recurse
+    if (selectsClientFieldSet) {
+      return false;
+    }
+
+    return;
+  }
+  return {
+    InlineFragment: visitor,
+    FragmentDefinition: visitor,
+    Field: visitor,
+    // TODO support directives on FragmentSpread
+  };
+}

package/src/language-server/fileSet.ts

@@ -0,0 +1,65 @@
+import minimatch from "minimatch";
+import glob from "glob";
+import { invariant } from "../tools";
+import URI from "vscode-uri";
+import { normalizeURI } from "./utilities";
+import { resolve } from "path";
+
+export class FileSet {
+  private rootURI: URI;
+  private includes: string[];
+  private excludes: string[];
+
+  constructor({
+    rootURI,
+    includes,
+    excludes,
+    configURI,
+  }: {
+    rootURI: URI;
+    includes: string[];
+    excludes: string[];
+    configURI?: URI;
+  }) {
+    invariant(rootURI, `Must provide "rootURI".`);
+    invariant(includes, `Must provide "includes".`);
+    invariant(excludes, `Must provide "excludes".`);
+
+    this.rootURI = rootURI;
+    this.includes = includes;
+    this.excludes = excludes;
+  }
+
+  includesFile(filePath: string): boolean {
+    const normalizedFilePath = normalizeURI(filePath);
+
+    return (
+      this.includes.some((include) => {
+        return minimatch(
+          normalizedFilePath,
+          resolve(this.rootURI.fsPath, include)
+        );
+      }) &&
+      !this.excludes.some((exclude) => {
+        return minimatch(
+          normalizedFilePath,
+          resolve(this.rootURI.fsPath, exclude)
+        );
+      })
+    );
+  }
+
+  allFiles(): string[] {
+    // since glob.sync takes a single pattern, but we allow an array of `includes`, we can join all the
+    // `includes` globs into a single pattern and pass to glob.sync. The `ignore` option does, however, allow
+    // an array of globs to ignore, so we can pass it in directly
+    const joinedIncludes = `{${this.includes.join(",")}}`;
+    return glob
+      .sync(joinedIncludes, {
+        cwd: this.rootURI.fsPath,
+        absolute: true,
+        ignore: this.excludes,
+      })
+      .map(normalizeURI);
+  }
+}

package/src/language-server/format.ts

@@ -0,0 +1,48 @@
+import moment from "moment";
+
+export function formatMS(
+  ms: number,
+  d: number,
+  allowMicros = false,
+  allowNanos = true
+) {
+  if (ms === 0 || ms === null) return "0";
+  const bounds = [
+    moment.duration(1, "hour").asMilliseconds(),
+    moment.duration(1, "minute").asMilliseconds(),
+    moment.duration(1, "second").asMilliseconds(),
+    1,
+    0.001,
+    0.000001,
+  ];
+  const units = ["hr", "min", "s", "ms", "μs", "ns"];
+
+  const makeSmallNumbersNice = (f: number) => {
+    if (f >= 100) return f.toFixed(0);
+    if (f >= 10) return f.toFixed(1);
+    if (f === 0) return "0";
+    return f.toFixed(2);
+  };
+
+  const bound = bounds.find((b) => b <= ms) || bounds[bounds.length - 1];
+  const boundIndex = bounds.indexOf(bound);
+  const unit = boundIndex >= 0 ? units[boundIndex] : "";
+
+  if ((unit === "μs" || unit === "ns") && !allowMicros) {
+    return "< 1ms";
+  }
+  if (unit === "ns" && !allowNanos) {
+    return "< 1µs";
+  }
+  const value =
+    typeof d !== "undefined"
+      ? (ms / bound).toFixed(d)
+      : makeSmallNumbersNice(ms / bound);
+
+  // if something is rounded to 1000 and not reduced this will catch and reduce it
+  if ((value === "1000" || value === "1000.0") && boundIndex >= 1) {
+    return `1${units[boundIndex - 1]}`;
+  }
+
+  return `${value}${unit}`;
+}