Add "use step" and "use workflow" typo detection and link to documentation (#88)

Author: TooTallNate

.changeset/tricky-wasps-ask.md

@@ -0,0 +1,5 @@
+---
+"@workflow/typescript-plugin": patch
+---
+
+Add "use step" and "use workflow" typo detection and link to documentation

packages/typescript-plugin/src/code-fixes.test.ts

@@ -0,0 +1,154 @@
+import ts from 'typescript/lib/tsserverlibrary';
+import { describe, expect, it } from 'vitest';
+import { getCodeFixes } from './code-fixes';
+import { createTestProgram } from './test-helpers';
+
+describe('getCodeFixes', () => {
+  describe('Code 9008: Directive typo fixes', () => {
+    it('provides a fix for "use workfow" typo', () => {
+      const source = `
+        export async function myWorkflow() {
+          'use workfow';
+          return 123;
+        }
+      `;
+
+      const { program, sourceFile } = createTestProgram(source);
+
+      // Find the position of 'use workfow'
+      const typoStart = sourceFile.text.indexOf("'use workfow'");
+      const typoEnd = typoStart + "'use workfow'".length;
+
+      const fixes = getCodeFixes(
+        'test.ts',
+        typoStart,
+        typoEnd,
+        9008,
+        program,
+        ts
+      );
+
+      expect(fixes.length).toBe(1);
+      expect(fixes[0].description).toContain('use workflow');
+      expect(fixes[0].fixName).toBe('fix-directive-typo');
+    });
+
+    it('provides a fix for "use ste" typo', () => {
+      const source = `
+        export async function myStep() {
+          'use ste';
+          return 'hello';
+        }
+      `;
+
+      const { program, sourceFile } = createTestProgram(source);
+
+      const typoStart = sourceFile.text.indexOf("'use ste'");
+      const typoEnd = typoStart + "'use ste'".length;
+
+      const fixes = getCodeFixes(
+        'test.ts',
+        typoStart,
+        typoEnd,
+        9008,
+        program,
+        ts
+      );
+
+      expect(fixes.length).toBe(1);
+      expect(fixes[0].description).toContain('use step');
+    });
+
+    it('replaces typo with correct directive preserving quotes', () => {
+      const source = `
+        export async function myWorkflow() {
+          'use workflw';
+          return 123;
+        }
+      `;
+
+      const { program, sourceFile } = createTestProgram(source);
+
+      const typoStart = sourceFile.text.indexOf("'use workflw'");
+      const typoEnd = typoStart + "'use workflw'".length;
+
+      const fixes = getCodeFixes(
+        'test.ts',
+        typoStart,
+        typoEnd,
+        9008,
+        program,
+        ts
+      );
+
+      expect(fixes.length).toBe(1);
+      const change = fixes[0].changes[0].textChanges[0];
+      expect(change.newText).toBe("'use workflow'");
+    });
+
+    it('works with double quotes', () => {
+      const source = `
+        export async function myStep() {
+          "use ste";
+          return 'hello';
+        }
+      `;
+
+      const { program, sourceFile } = createTestProgram(source);
+
+      const typoStart = sourceFile.text.indexOf('"use ste"');
+      const typoEnd = typoStart + '"use ste"'.length;
+
+      const fixes = getCodeFixes(
+        'test.ts',
+        typoStart,
+        typoEnd,
+        9008,
+        program,
+        ts
+      );
+
+      expect(fixes.length).toBe(1);
+      const change = fixes[0].changes[0].textChanges[0];
+      expect(change.newText).toBe('"use step"');
+    });
+  });
+
+  describe('Non-typo error codes', () => {
+    it('does not provide fixes for other error codes', () => {
+      const source = `
+        export async function myWorkflow() {
+          'use workflow';
+          return 123;
+        }
+      `;
+
+      const { program } = createTestProgram(source);
+
+      const start = 0;
+      const end = 10;
+
+      // Try code 9001 (not a typo)
+      const fixes = getCodeFixes('test.ts', start, end, 9001, program, ts);
+
+      expect(fixes.length).toBe(0);
+    });
+  });
+
+  describe('Edge cases', () => {
+    it('does not crash on invalid position', () => {
+      const source = `
+        export async function myWorkflow() {
+          'use workflow';
+          return 123;
+        }
+      `;
+
+      const { program } = createTestProgram(source);
+
+      const fixes = getCodeFixes('test.ts', 999999, 999999, 9008, program, ts);
+
+      expect(fixes.length).toBe(0);
+    });
+  });
+});

packages/typescript-plugin/src/code-fixes.ts

@@ -0,0 +1,85 @@
+import type {
+  CodeFixAction,
+  FileTextChanges,
+  Node,
+  Program,
+} from 'typescript/lib/tsserverlibrary';
+import { getDirectiveTypo } from './utils';
+
+type TypeScriptLib = typeof import('typescript/lib/tsserverlibrary');
+
+export function getCodeFixes(
+  fileName: string,
+  start: number,
+  end: number,
+  errorCode: number,
+  program: Program,
+  ts: TypeScriptLib
+): CodeFixAction[] {
+  const fixes: CodeFixAction[] = [];
+
+  // Only provide fixes for typo errors (code 9008)
+  if (errorCode !== 9008) {
+    return fixes;
+  }
+
+  const sourceFile = program.getSourceFile(fileName);
+  if (!sourceFile) {
+    return fixes;
+  }
+
+  // Find the string literal at the error position
+  let stringNode: Node | undefined;
+
+  function visit(node: Node) {
+    if (
+      ts.isStringLiteral(node) &&
+      node.getStart(sourceFile) <= start &&
+      node.getEnd() >= end
+    ) {
+      stringNode = node;
+      return;
+    }
+    ts.forEachChild(node, visit);
+  }
+
+  visit(sourceFile);
+
+  if (!stringNode || !ts.isStringLiteral(stringNode)) {
+    return fixes;
+  }
+
+  const typoText = stringNode.text;
+  const expectedDirective = getDirectiveTypo(typoText);
+
+  if (!expectedDirective) {
+    return fixes;
+  }
+
+  // Get the quote character from the source
+  const sourceText = sourceFile.text;
+  const nodeStart = stringNode.getStart(sourceFile);
+  const quoteChar = sourceText[nodeStart];
+
+  // Create a fix that replaces the typo with the correct directive
+  const change: FileTextChanges = {
+    fileName,
+    textChanges: [
+      {
+        span: {
+          start: nodeStart,
+          length: stringNode.getWidth(sourceFile),
+        },
+        newText: `${quoteChar}${expectedDirective}${quoteChar}`,
+      },
+    ],
+  };
+
+  fixes.push({
+    fixName: 'fix-directive-typo',
+    description: `Replace with '${expectedDirective}'`,
+    changes: [change],
+  });
+
+  return fixes;
+}