Handle MDX parse errors (#374)

mdx-js · Dec 18, 2023 · b6b641d · b6b641d
1 parent 346dd7f
commit b6b641d
Show file tree

Hide file tree

Showing 12 changed files with 133 additions and 42 deletions.
diff --git a/.changeset/loud-balloons-roll.md b/.changeset/loud-balloons-roll.md
@@ -0,0 +1,7 @@
+---
+"@mdx-js/language-service": patch
+"@mdx-js/language-server": patch
+"vscode-mdx": patch
+---
+
+Report syntax errors.
diff --git a/fixtures/node16/syntax-error.mdx b/fixtures/node16/syntax-error.mdx
@@ -0,0 +1 @@
+export 1/1
diff --git a/packages/language-server/lib/language-server-plugin.js b/packages/language-server/lib/language-server-plugin.js
@@ -3,7 +3,10 @@
  */
 
 import assert from 'node:assert'
-import {createMdxLanguagePlugin} from '@mdx-js/language-service'
+import {
+  createMdxLanguagePlugin,
+  createMdxServicePlugin
+} from '@mdx-js/language-service'
 import {create as createMarkdownService} from 'volar-service-markdown'
 import {create as createTypeScriptService} from 'volar-service-typescript'
 import {loadPlugins} from './configuration.js'
@@ -45,6 +48,7 @@ export function plugin({modules}) {
 
       config.services ||= {}
       config.services.markdown = createMarkdownService()
+      config.services.mdx = createMdxServicePlugin()
       config.services.typescript = createTypeScriptService(modules.typescript)
 
       return config

diff --git a/packages/language-server/test/completion.test.js b/packages/language-server/test/completion.test.js
@@ -51,7 +51,7 @@ test('support completion in ESM', async () => {
           uri: fixtureUri('node16/completion.mdx.jsx')
         }
       },
-      serviceIndex: 1,
+      serviceIndex: 2,
       uri: fixtureUri('node16/completion.mdx'),
       virtualDocumentUri: fixtureUri('node16/completion.mdx.jsx')
     },
@@ -107,7 +107,7 @@ test('support completion in JSX', async () => {
           uri: fixtureUri('node16/completion.mdx.jsx')
         }
       },
-      serviceIndex: 1,
+      serviceIndex: 2,
       uri: fixtureUri('node16/completion.mdx'),
       virtualDocumentUri: fixtureUri('node16/completion.mdx.jsx')
     },

diff --git a/packages/language-server/test/diagnostics.test.js b/packages/language-server/test/diagnostics.test.js
@@ -17,6 +17,47 @@ afterEach(() => {
   serverHandle.connection.dispose()
 })
 
+test('parse errors', async () => {
+  const {uri} = await serverHandle.openTextDocument(
+    fixturePath('node16/syntax-error.mdx'),
+    'mdx'
+  )
+  const diagnostics = await serverHandle.sendDocumentDiagnosticRequest(uri)
+
+  assert.deepEqual(diagnostics, {
+    kind: 'full',
+    items: [
+      {
+        code: 'acorn',
+        codeDescription: {
+          href: 'https://github.com/micromark/micromark-extension-mdxjs-esm#could-not-parse-importexports-with-acorn'
+        },
+        data: {
+          documentUri: fixtureUri('node16/syntax-error.mdx'),
+          isFormat: false,
+          original: {},
+          serviceIndex: 1,
+          uri: fixtureUri('node16/syntax-error.mdx'),
+          version: 0
+        },
+        message: 'Could not parse import/exports with acorn',
+        range: {
+          end: {
+            character: 7,
+            line: 0
+          },
+          start: {
+            character: 7,
+            line: 0
+          }
+        },
+        severity: 1,
+        source: 'MDX'
+      }
+    ]
+  })
+})
+
 test('type errors', async () => {
   const {uri} = await serverHandle.openTextDocument(
     fixturePath('node16/type-errors.mdx'),
@@ -33,7 +74,7 @@ test('type errors', async () => {
           documentUri: fixtureUri('node16/type-errors.mdx.jsx'),
           isFormat: false,
           original: {},
-          serviceIndex: 1,
+          serviceIndex: 2,
           uri: fixtureUri('node16/type-errors.mdx'),
           version: 1
         },
@@ -52,7 +93,7 @@ test('type errors', async () => {
           documentUri: fixtureUri('node16/type-errors.mdx.jsx'),
           isFormat: false,
           original: {},
-          serviceIndex: 1,
+          serviceIndex: 2,
           uri: fixtureUri('node16/type-errors.mdx'),
           version: 1
         },

diff --git a/packages/language-server/test/plugins.test.js b/packages/language-server/test/plugins.test.js
diff --git a/packages/language-service/index.js b/packages/language-service/index.js
@@ -1 +1,2 @@
 export {createMdxLanguagePlugin} from './lib/language-plugin.js'
+export {createMdxServicePlugin} from './lib/service-plugin.js'
diff --git a/packages/language-service/lib/language-plugin.js b/packages/language-service/lib/language-plugin.js
@@ -1,5 +1,5 @@
 /**
- * @typedef {import('@volar/language-core').LanguagePlugin<VirtualMdxFile>} LanguagePlugin
+ * @typedef {import('@volar/language-service').LanguagePlugin<VirtualMdxFile>} LanguagePlugin
  * @typedef {import('unified').PluggableList} PluggableList
  */
 

diff --git a/packages/language-service/lib/service-plugin.js b/packages/language-service/lib/service-plugin.js
@@ -0,0 +1,67 @@
+/**
+ * @typedef {import('@volar/language-service').ServicePlugin} ServicePlugin
+ */
+
+import {fromPlace} from 'unist-util-lsp'
+import {VirtualMdxFile} from './virtual-file.js'
+
+/**
+ * Create an Volar service plugin for MDX files.
+ *
+ * The service supports reporting diagnostics for parsing errors.
+ *
+ * @returns {ServicePlugin}
+ *   The Volar service plugin for MDX files.
+ */
+export function createMdxServicePlugin() {
+  return {
+    create(context) {
+      return {
+        provideSemanticDiagnostics(document) {
+          const file = getVirtualMdxFile(document.uri)
+
+          const error = file?.error
+
+          if (error) {
+            return [
+              {
+                message: error.message,
+                code: error.ruleId,
+                codeDescription: {
+                  href:
+                    error.url || 'https://mdxjs.com/docs/troubleshooting-mdx/'
+                },
+                range: error.place
+                  ? fromPlace(error.place)
+                  : {
+                      start: {line: 0, character: 0},
+                      end: {line: 0, character: 0}
+                    },
+                severity: 1,
+                source: 'MDX'
+              }
+            ]
+          }
+        }
+      }
+
+      /**
+       * Get the virtual MDX file that matches a document uri.
+       *
+       * @param {string} uri
+       *   The uri of which to find the matching virtual MDX file.
+       * @returns {VirtualMdxFile | undefined}
+       *   The matching virtual MDX file, if it exists. Otherwise undefined.
+       */
+      function getVirtualMdxFile(uri) {
+        const [file] = context.language.files.getVirtualFile(
+          context.env.uriToFileName(uri)
+        )
+
+        if (file instanceof VirtualMdxFile) {
+          return file
+        }
+      }
+    }
+  }
+}
diff --git a/packages/language-service/lib/virtual-file.js b/packages/language-service/lib/virtual-file.js
@@ -1,7 +1,7 @@
 /**
- * @typedef {import('@volar/language-core').CodeInformation} CodeInformation
- * @typedef {import('@volar/language-core').Mapping<CodeInformation>} Mapping
- * @typedef {import('@volar/language-core').VirtualFile} VirtualFile
+ * @typedef {import('@volar/language-service').CodeInformation} CodeInformation
+ * @typedef {import('@volar/language-service').Mapping<CodeInformation>} Mapping
+ * @typedef {import('@volar/language-service').VirtualFile} VirtualFile
  * @typedef {import('estree').ExportDefaultDeclaration} ExportDefaultDeclaration
  * @typedef {import('mdast').Nodes} Nodes
  * @typedef {import('mdast').Root} Root

diff --git a/packages/language-service/package.json b/packages/language-service/package.json
@@ -34,11 +34,12 @@
     "@types/estree": "^1.0.0",
     "@types/mdast": "^4.0.0",
     "@types/unist": "^3.0.0",
-    "@volar/language-core": "2.0.0-alpha.7",
+    "@volar/language-service": "2.0.0-alpha.7",
     "mdast-util-mdxjs-esm": "^2.0.0",
     "remark-mdx": "^3.0.0",
     "remark-parse": "^11.0.0",
     "unified": "^11.0.0",
+    "unist-util-lsp": "^2.0.0",
     "vfile-message": "^4.0.0"
   },
   "devDependencies": {

diff --git a/packages/language-service/test/language-module.js b/packages/language-service/test/language-module.js
@@ -1,5 +1,5 @@
 /**
- * @typedef {import('@volar/language-core').VirtualFile} VirtualFile
+ * @typedef {import('@volar/language-service').VirtualFile} VirtualFile
  */
 
 import assert from 'node:assert/strict'