feat: add links to diagnostic error codes via codeDescription (#2936)

closes #2933

Author: jasonlyu123

.changeset/good-steaks-judge.md

@@ -0,0 +1,5 @@
+---
+'svelte-language-server': patch
+---
+
+feat: add links to diagnostic error codes via codeDescription

packages/language-server/src/plugins/svelte/features/getDiagnostics.ts

@@ -1,5 +1,6 @@
 import {
     CancellationToken,
+    CodeDescription,
     Diagnostic,
     DiagnosticSeverity,
     Position,
@@ -77,7 +78,7 @@ async function tryGetDiagnostics(
             .map((warning) => {
                 const start = warning.start || { line: 1, column: 0 };
                 const end = warning.end || start;
-                return {
+                const result: Diagnostic = {
                     range: Range.create(start.line - 1, start.column, end.line - 1, end.column),
                     message: warning.message,
                     severity:
@@ -87,6 +88,14 @@ async function tryGetDiagnostics(
                     source: 'svelte',
                     code: warning.code
                 };
+                const codeDescription = getCodeDescription(
+                    warning.code,
+                    'https://svelte.dev/docs/svelte/compiler-warnings#'
+                );
+                if (codeDescription) {
+                    result.codeDescription = codeDescription;
+                }
+                return result;
             })
             .map((diag) => mapObjWithRangeToOriginal(transpiled, diag))
             .map((diag) => adjustMappings(diag, document))
@@ -154,9 +163,34 @@ function createParserErrorDiagnostic(error: any, document: Document) {
         }
     }
 
+    const codeDescription = getCodeDescription(
+        error.code,
+        'https://svelte.dev/docs/svelte/compiler-errors#'
+    );
+    if (codeDescription) {
+        diagnostic.codeDescription = codeDescription;
+    }
+
     return [diagnostic];
 }
 
+function getCodeDescription(code: unknown, url: string): CodeDescription | undefined {
+    if (typeof code !== 'string') {
+        return undefined;
+    }
+
+    const firstChar = code.charCodeAt(0);
+    if (isLowerLetter(firstChar) && (code.includes('-') || code.includes('_'))) {
+        return {
+            href: url + code.replace(/-/g, '_')
+        };
+    }
+}
+
+function isLowerLetter(charCode: number) {
+    return charCode >= 97 && charCode <= 122;
+}
+
 /**
  * Try to infer a nice diagnostic error message from the transpilation error.
  */

packages/language-server/test/plugins/svelte/SveltePlugin.test.ts

@@ -45,6 +45,9 @@ describe('Svelte Plugin', () => {
             isSvelte5Plus ? 'a11y_missing_attribute' : 'a11y-missing-attribute',
             'svelte'
         );
+        diagnostic.codeDescription = {
+            href: 'https://svelte.dev/docs/svelte/compiler-warnings#a11y_missing_attribute'
+        };
 
         assert.deepStrictEqual(diagnostics, [diagnostic]);
     });
@@ -63,6 +66,13 @@ describe('Svelte Plugin', () => {
             'svelte'
         );
 
+        diagnostic.codeDescription = {
+            href: isSvelte5Plus
+                ? 'https://svelte.dev/docs/svelte/compiler-errors#bind_invalid_name'
+                : // doesn't actually exist but at least points to the page
+                  'https://svelte.dev/docs/svelte/compiler-errors#binding_undeclared'
+        };
+
         assert.deepStrictEqual(diagnostics, [diagnostic]);
     });
 

packages/language-server/test/plugins/svelte/features/getDiagnostics.test.ts

@@ -475,7 +475,13 @@ describe('SveltePlugin#getDiagnostics', () => {
                     (isSvelte5Plus ? '\nhttps://svelte.dev/e/export_let_unused' : ''),
                 severity: 2,
                 source: 'svelte',
-                code: isSvelte5Plus ? 'export_let_unused' : 'unused-export-let'
+                code: isSvelte5Plus ? 'export_let_unused' : 'unused-export-let',
+                codeDescription: {
+                    href: isSvelte5Plus
+                        ? 'https://svelte.dev/docs/svelte/compiler-warnings#export_let_unused'
+                        : // doesn't actually exist but at least points to the page
+                          'https://svelte.dev/docs/svelte/compiler-warnings#unused_export_let'
+                }
             }
         ]);
     });
@@ -496,7 +502,12 @@ describe('SveltePlugin#getDiagnostics', () => {
                     source: 'svelte',
                     code: isSvelte5Plus
                         ? 'reactive_declaration_invalid_placement'
-                        : 'module-script-reactive-declaration'
+                        : 'module-script-reactive-declaration',
+                    codeDescription: {
+                        href: isSvelte5Plus
+                            ? 'https://svelte.dev/docs/svelte/compiler-warnings#reactive_declaration_invalid_placement'
+                            : 'https://svelte.dev/docs/svelte/compiler-warnings#module_script_reactive_declaration'
+                    }
                 }
             ]
         );
@@ -525,7 +536,13 @@ describe('SveltePlugin#getDiagnostics', () => {
                         }
                     },
                     severity: 2,
-                    source: 'svelte'
+                    source: 'svelte',
+                    codeDescription: {
+                        href: isSvelte5Plus
+                            ? 'https://svelte.dev/docs/svelte/compiler-warnings#export_let_unused'
+                            : // doesn't actually exist but at least points to the page
+                              'https://svelte.dev/docs/svelte/compiler-warnings#unused_export_let'
+                    }
                 },
                 {
                     code: isSvelte5Plus ? 'export_let_unused' : 'unused-export-let',
@@ -543,7 +560,13 @@ describe('SveltePlugin#getDiagnostics', () => {
                         }
                     },
                     severity: 2,
-                    source: 'svelte'
+                    source: 'svelte',
+                    codeDescription: {
+                        href: isSvelte5Plus
+                            ? 'https://svelte.dev/docs/svelte/compiler-warnings#export_let_unused'
+                            : // doesn't actually exist but at least points to the page
+                              'https://svelte.dev/docs/svelte/compiler-warnings#unused_export_let'
+                    }
                 }
             ]
         );