fix: fade unused TypeScript variables (#728)

Author: levivilet

package-lock.json

@@ -6,14 +6,16 @@ export const test: Test = async ({ Command, Editor, expect, FileSystem, Locator,
   // arrange
   const fixtureUrl = import.meta.resolve('../fixtures/diagnostics-unused')
   const workspaceUrl = await FileSystem.loadFixture(fixtureUrl)
-  await Workspace.setPath(workspaceUrl)
+  await Workspace.setUri(workspaceUrl)
   await Settings.update({ 'editor.diagnostics': true })
 
   // act
   await Main.openUri(`${workspaceUrl}/src/test.ts`)
   await Command.execute('Editor.waitForDiagnostics')
 
   // assert
+  const diagnostics = Locator('.Diagnostic')
+  const unnecessaryTokens = Locator('.EditorTokenUnnecessary')
   const expectedDiagnostics = [
     {
       code: 6133,
@@ -23,10 +25,24 @@ export const test: Test = async ({ Command, Editor, expect, FileSystem, Locator,
       message: "'unused' is declared but its value is never read.",
       rowIndex: 1,
       source: 'ts',
+      tags: [1],
       type: 'warning',
       uri: `${workspaceUrl}/src/test.ts`,
     },
   ] as const
-  await expect(Locator('.Diagnostic')).toHaveCount(expectedDiagnostics.length)
+  await expect(diagnostics).toHaveCount(expectedDiagnostics.length)
   await Editor.shouldHaveDiagnostics(expectedDiagnostics)
+  await expect(unnecessaryTokens).toHaveText('unused')
+
+  // Make the variable used and verify the unnecessary styling is removed without reopening the file.
+  await Editor.setText('export const fixture = true\nconst unused = 1\nvoid unused\n\nexport {}')
+  await Command.execute('Editor.waitForDiagnostics')
+  await Editor.shouldHaveDiagnostics([])
+  await expect(unnecessaryTokens).toHaveCount(0)
+
+  // Restore the unused declaration and verify the styling returns.
+  await Editor.setText('export const fixture = true\nconst unused = 1\n\nexport {}')
+  await Command.execute('Editor.waitForDiagnostics')
+  await Editor.shouldHaveDiagnostics(expectedDiagnostics)
+  await expect(unnecessaryTokens).toHaveText('unused')
 }

packages/e2e/src/typescript.diagnostics-unused-local.ts

@@ -35,6 +35,7 @@
     }
   },
   "dependencies": {
+    "@lvce-editor/api": "^9.42.1",
     "@noble/hashes": "2.4.0"
   }
 }

packages/typescript-worker/package.json

@@ -1,3 +1,4 @@
+import { DiagnosticTag } from '@lvce-editor/api'
 import * as GetDiagnosticSeverity from '../GetDiagnosticSeverity/GetDiagnosticSeverity.ts'
 import { getPositionAt } from '../GetPositionAt/GetPositionAt.ts'
 
@@ -13,6 +14,7 @@ interface TypeScriptDiagnostic {
   readonly length: number | undefined
   readonly messageText: string | TypeScriptDiagnosticMessageChain
   readonly relatedInformation?: readonly TypeScriptDiagnostic[]
+  readonly reportsUnnecessary?: object
   readonly start: number | undefined
 }
 
@@ -31,6 +33,7 @@ interface ConvertedDiagnostic {
   readonly relatedInformation?: readonly ConvertedRelatedInformation[]
   readonly rowIndex: number
   readonly source: 'ts'
+  readonly tags?: readonly number[]
   readonly type: 'error' | 'warning'
   readonly uri: string
 }
@@ -98,7 +101,11 @@ const convertTsDiagnostic = (text: string, diagnostic: TypeScriptDiagnosticWithL
     const convertedItem = convertRelatedInformation(item)
     return convertedItem ? [convertedItem] : []
   })
-  return relatedInformation && relatedInformation.length > 0 ? { ...converted, relatedInformation } : converted
+  const withRelatedInformation =
+    relatedInformation && relatedInformation.length > 0 ? { ...converted, relatedInformation } : converted
+  return diagnostic.reportsUnnecessary
+    ? { ...withRelatedInformation, tags: [DiagnosticTag.Unnecessary] }
+    : withRelatedInformation
 }
 
 const hasLocation = (diagnostic: TypeScriptDiagnostic): diagnostic is TypeScriptDiagnosticWithLocation => {

packages/typescript-worker/src/parts/GetDiagnosticFromTsResult2/GetDiagnosticFromTsResult2.ts

@@ -46,6 +46,37 @@ test('converts diagnostics with a source location', () => {
   ])
 })
 
+test('preserves unnecessary tags from TypeScript diagnostics', () => {
+  const diagnostics = [
+    {
+      category: 1,
+      code: 6133,
+      file: {
+        fileName: '/test.ts',
+      } as ts.SourceFile,
+      length: 6,
+      messageText: "'unused' is declared but its value is never read.",
+      reportsUnnecessary: {},
+      start: 6,
+    },
+  ] as const
+
+  expect(getDiagnosticsFromTsResult2('const unused = 1', diagnostics)).toEqual([
+    {
+      code: 6133,
+      columnIndex: 6,
+      endColumnIndex: 12,
+      endRowIndex: 0,
+      message: "'unused' is declared but its value is never read.",
+      rowIndex: 0,
+      source: 'ts',
+      tags: [1],
+      type: 'warning',
+      uri: '/test.ts',
+    },
+  ])
+})
+
 test('flattens diagnostic message chains', () => {
   const diagnostics = [
     {