LSP Rewrite: fix many bugs, more LSP test coverage! (#3521)

see: changelog entries

.changeset/rotten-seahorses-fry.md

@@ -0,0 +1,46 @@
+---
+'graphql-language-service-server': minor
+'vscode-graphql': minor
+'graphql-language-service-server-cli': minor
+---
+
+Fix many schema and fragment lifecycle issues, not all of them, but many related to cacheing.
+Note: this makes `cacheSchemaForLookup` enabled by default again for schema first contexts.
+
+This fixes multiple cacheing bugs, upon addomg some in-depth integration test coverage for the LSP server.
+It also solves several bugs regarding loading config types, and properly restarts the server and invalidates schema when there are config changes.
+
+### Bugfix Summary
+
+- configurable polling updates for network and other code first schema configuration, set to a 30s interval by default. powered by `schemaCacheTTL` which can be configured in the IDE settings (vscode, nvim) or in the graphql config file. (1)
+- jump to definition in embedded files offset bug, for both fragments and code files with SDL strings
+- cache invalidation for fragments (fragment lookup/autcoomplete data is more accurate, but incomplete/invalid fragments still do not autocomplete or validate, and remember fragment options always filter/validate by the `on` type!)
+- schema cache invalidation for schema files - schema updates as you change the SDL files, and the generated file for code first by the `schemaCacheTTL` setting
+- schema definition lookups & autocomplete crossing over into the wrong project
+
+**Notes**
+
+1. If possible, configuring for your locally running framework or a schema registry client to handle schema updates and output to a `schema.graphql` or `introspection.json` will always provide a better experience. many graphql frameworks have this built in! Otherwise, we must use this new lazy polling approach if you provide a url schema (this includes both introspection URLs and remote file URLs, and the combination of these).
+
+### Known Bugs Fixed
+
+- #3318
+- #2357
+- #3469
+- #2422
+- #2820
+- many more!
+
+### Test Improvements
+
+- new, high level integration spec suite for the LSP with a matching test utility
+- more unit test coverage
+- **total increased test coverage of about 25% in the LSP server codebase.**
+- many "happy paths" covered for both schema and code first contexts
+- many bugs revealed (and their source)
+
+### What's next?
+
+Another stage of the rewrite is already almost ready. This will fix even more bugs and improve memory usage, eliminate redundant parsing and ensure that graphql config's loaders do _all_ of the parsing and heavy lifting, thus honoring all the configs as well. It also significantly reduces the code complexity.
+
+There is also a plan to match Relay LSP's lookup config for either IDE (vscode, nvm, etc) settings as they provide, or by loading modules into your `graphql-config`!

.changeset/silly-yaks-bathe.md

@@ -0,0 +1,15 @@
+---
+'graphql-language-service': patch
+'graphql-language-service-server': patch
+'graphql-language-service-server-cli': patch
+'codemirror-graphql': patch
+'cm6-graphql': patch
+'monaco-graphql': patch
+'vscode-graphql': patch
+---
+
+Fixes several issues with Type System (SDL) completion across the ecosystem:
+
+- restores completion for object and input type fields when the document context is not detectable or parseable
+- correct top-level completions for either of the unknown, type system or executable definitions. this leads to mixed top level completions when the document is unparseable, but now you are not seemingly restricted to only executable top level definitions
+- `.graphqls` ad-hoc standard functionality remains, but is not required, as it is not part of the official spec, and the spec also allows mixed mode documents in theory, and this concept is required when the type is unknown

.changeset/wet-toes-mate.md

@@ -0,0 +1,72 @@
+---
+'graphql-language-service-server': minor
+'vscode-graphql': patch
+---
+
+Introduce `locateCommand` based on Relay LSP `pathToLocateCommand`:
+
+Now with `<graphql config>.extensions.languageService.locateCommand`, you can specify either the [existing signature](https://marketplace.visualstudio.com/items?itemName=meta.relay#relay.pathtolocatecommand-default-null) for relay, with the same callback parameters and return signature.
+
+Relay LSP currently supports `Type` and `Type.field` for the 2nd argument. Ours also returns `Type.field(argument)` as a point of reference. It works with object types, input types, fragments, executable definitions and their fields, and should work for directive definitions as well.
+
+In the case of unnamed types such as fragment spreads, they return the name of the implemented type currently, but I'm curious what users prefer here. I assumed that some people may want to not be limited to only using this for SDL type definition lookups. Also look soon to see `locateCommand` support added for symbols, outline, and coming references and implementations.
+
+The module at the path you specify in relay LSP for `pathToLocateCommand` should work as such
+
+```ts
+// import it
+import { locateCommand } from './graphql/tooling/lsp/locate.js';
+export default {
+  languageService: {
+    locateCommand,
+  },
+
+  projects: {
+    a: {
+      schema: 'https://localhost:8000/graphql',
+      documents: './a/**/*.{ts,tsx,jsx,js,graphql}',
+    },
+    b: {
+      schema: './schema/ascode.ts',
+      documents: './b/**/*.{ts,tsx,jsx,js,graphql}',
+    },
+  },
+};
+```
+
+```ts
+// or define it inline
+
+import { type LocateCommand } from 'graphql-language-service-server';
+
+// relay LSP style
+const languageCommand = (projectName: string, typePath: string) => {
+  const { path, startLine, endLine } = ourLookupUtility(projectName, typePath);
+  return `${path}:${startLine}:${endLine}`;
+};
+
+// an example with our alternative return signature
+const languageCommand: LocateCommand = (projectName, typePath, info) => {
+  // pass more info, such as GraphQLType with the ast node. info.project is also available if you need it
+  const { path, range } = ourLookupUtility(
+    projectName,
+    typePath,
+    info.type.node,
+  );
+  return { uri: path, range }; // range.start.line/range.end.line
+};
+
+export default {
+  languageService: {
+    locateCommand,
+  },
+  schema: 'https://localhost:8000/graphql',
+  documents: './**/*.{ts,tsx,jsx,js,graphql}',
+};
+```
+
+Passing a string as a module path to resolve is coming in a follow-up release. Then it can be used with `.yml`, `.toml`, `.json`, `package.json#graphql`, etc
+
+For now this was a quick baseline for a feature asked for in multiple channels!
+
+Let us know how this works, and about any other interoperability improvements between our graphql LSP and other language servers (relay, intellij, etc) used by you and colleauges in your engineering organisations. We are trying our best to keep up with the awesome innovations they have 👀!

.github/workflows/pr.yml

@@ -13,7 +13,6 @@ jobs:
         uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
           cache: yarn
       - name: Cache node modules
         id: cache-modules
@@ -37,8 +36,7 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
-        with:
-          node-version: 16
+
       - id: cache-modules
         uses: actions/cache@v3
         with:
@@ -59,8 +57,6 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
-        with:
-          node-version: 16
       - id: cache-modules
         uses: actions/cache@v3
         with:
@@ -76,8 +72,6 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
-        with:
-          node-version: 16
       - id: cache-modules
         uses: actions/cache@v3
         with:
@@ -87,14 +81,12 @@ jobs:
       - run: yarn pretty-check
 
   jest:
-    name: Jest Unit Tests
+    name: Jest Unit & Integration Tests
     runs-on: ubuntu-latest
     needs: [install]
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
-        with:
-          node-version: 16
       - id: cache-modules
         uses: actions/cache@v3
         with:
@@ -117,8 +109,7 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
-        with:
-          node-version: 16
+
       - id: cache-modules
         uses: actions/cache@v3
         with:
@@ -140,8 +131,7 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
-        with:
-          node-version: 16
+
       - id: cache-modules
         uses: actions/cache@v3
         with:
@@ -205,8 +195,6 @@ jobs:
         with:
           fetch-depth: 0
       - uses: actions/setup-node@v3
-        with:
-          node-version: 16
       - id: cache-modules
         uses: actions/cache@v3
         with:
@@ -264,8 +252,6 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
-        with:
-          node-version: 16
       - id: cache-modules
         uses: actions/cache@v3
         with:

.nvmrc

@@ -1 +1 @@
-16
+20

cspell.json

@@ -9,7 +9,7 @@
   "dictionaryDefinitions": [
     {
       "name": "custom-words",
-      "path": "./custom-words.txt",
+      "path": "./resources/custom-words.txt",
       "addWords": true
     }
   ],

examples/monaco-graphql-react-vite/vite.config.ts

@@ -19,5 +19,24 @@ export default defineConfig({
         },
       ],
     }),
+    watchPackages(['monaco-graphql', 'graphql-language-service']),
   ],
 });
+
+function watchPackages(packageNames: string[]) {
+  let isWatching = false;
+
+  return {
+    name: 'vite-plugin-watch-packages',
+
+    buildStart() {
+      if (!isWatching) {
+        for (const packageName of packageNames) {
+          this.addWatchFile(require.resolve(packageName));
+        }
+
+        isWatching = true;
+      }
+    },
+  };
+}

jest.config.base.js

@@ -43,7 +43,7 @@ module.exports = (dir, env = 'jsdom') => {
       'node_modules',
       '__tests__',
       'resources',
-      'test',
+
       'examples',
       '.d.ts',
       'types.ts',

package.json

@@ -15,12 +15,12 @@
   "lint-staged": {
     "*.{js,ts,jsx,tsx}": [
       "eslint --cache --fix",
-      "prettier --write --ignore-path .eslintignore",
+      "prettier --write --ignore-path .eslintignore --ignore-path resources/prettierignore",
       "jest --passWithNoTests",
       "yarn lint-cspell"
     ],
     "*.{md,html,json,css}": [
-      "prettier --write --ignore-path .eslintignore",
+      "prettier --write --ignore-path .eslintignore --ignore-path resources/prettierignore",
       "yarn lint-cspell"
     ]
   },
@@ -43,7 +43,7 @@
     "build:watch": "yarn tsc --watch",
     "build-demo": "wsrun -m build-demo",
     "watch": "yarn build:watch",
-    "watch-vscode": "yarn workspace vscode-graphql compile",
+    "watch-vscode": "yarn tsc && yarn workspace vscode-graphql compile",
     "watch-vscode-exec": "yarn workspace vscode-graphql-execution compile",
     "check": "yarn tsc --noEmit",
     "cypress-open": "yarn workspace graphiql cypress-open",
@@ -62,7 +62,7 @@
     "prepublishOnly": "./scripts/prepublish.sh",
     "postbuild": "wsrun --exclude-missing postbuild",
     "pretty": "yarn pretty-check --write",
-    "pretty-check": "prettier --cache --check --ignore-path .gitignore --ignore-path .eslintignore .",
+    "pretty-check": "prettier --cache --check --ignore-path .gitignore --ignore-path resources/prettierignore --ignore-path .eslintignore .",
     "ci:version": "yarn changeset version && yarn build && yarn format",
     "release": "yarn build && yarn build-bundles && (wsrun release --exclude-missing --serial --recursive --changedSince main -- || true) && yarn changeset publish",
     "release:canary": "(node scripts/canary-release.js && yarn build-bundles && yarn changeset publish --tag canary) || echo Skipping Canary...",

packages/cm6-graphql/src/completions.ts

@@ -26,7 +26,14 @@ export const completion = graphqlLanguage.data.of({
     }
     const val = ctx.state.doc.toString();
     const pos = offsetToPos(ctx.state.doc, ctx.pos);
-    const results = getAutocompleteSuggestions(schema, val, pos);
+    const results = getAutocompleteSuggestions(
+      schema,
+      val,
+      pos,
+      undefined,
+      undefined,
+      opts?.autocompleteOptions,
+    );
 
     if (results.length === 0) {
       return null;

packages/cm6-graphql/src/interfaces.ts

@@ -1,7 +1,11 @@
 import { Completion, CompletionContext } from '@codemirror/autocomplete';
 import { EditorView } from '@codemirror/view';
 import { GraphQLSchema } from 'graphql';
-import { ContextToken, CompletionItem } from 'graphql-language-service';
+import {
+  ContextToken,
+  CompletionItem,
+  AutocompleteSuggestionOptions,
+} from 'graphql-language-service';
 import { Position } from './helpers';
 export interface GqlExtensionsOptions {
   showErrorOnInvalidSchema?: boolean;
@@ -18,4 +22,5 @@ export interface GqlExtensionsOptions {
     ctx: CompletionContext,
     item: Completion,
   ) => Node | Promise<Node | null> | null;
+  autocompleteOptions?: AutocompleteSuggestionOptions;
 }