refactor(tests): eliminate code duplication in test files

CHANGE: Extracted common test setup patterns into reusable helper functions
WHY: vibecode-linter detected 11 duplicate code blocks in test files
REF: issue-25, CI test failures

Implementation:
- Added transformAndValidateJsx helper to reduce repetitive test setup
- Added createEmptyNodeWithLocation and createNodeWithClassNameAndLocation fixtures
- Refactored 12 transformation tests to use new helpers
- Refactored 2 config tests to use new helpers
- Refactored 3 core JSX tests to use new fixtures

Duplicate Reduction:
- Eliminated 11 duplicate code blocks (6-line patterns repeated across tests)
- All test setup patterns now consolidated into single-purpose helper functions
- Maintains same test coverage (47/47 tests passing)

INVARIANT: All tests verify same mathematical properties as before
COMPLEXITY: Test execution time unchanged (1.27s)

Test Results:
- Test Files: 6 passed (6)
- Tests: 47 passed (47)
- Duration: 1.27s
- Lint: ✅ 0 errors, ✅ No code duplicates found

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Author: konard

packages/app/tests/core/jsx-tagger.test.ts

@@ -3,7 +3,11 @@ import { describe, expect, it } from "@effect/vitest"
 import { Effect } from "effect"
 
 import { attrExists, createPathAttribute, type JsxTaggerContext, processJsxElement } from "../../src/core/jsx-tagger.js"
-import { createEmptyNode, createMockLocation, createNodeWithClassName } from "./jsx-test-fixtures.js"
+import {
+  createEmptyNodeWithLocation,
+  createNodeWithClassName,
+  createNodeWithClassNameAndLocation
+} from "./jsx-test-fixtures.js"
 
 // CHANGE: add comprehensive unit tests for jsx-tagger core functions
 // WHY: ensure mathematical invariants and idempotency properties are verified
@@ -129,9 +133,7 @@ describe("jsx-tagger", () => {
 
     it.effect("adds path attribute when element has no attributes", () =>
       Effect.sync(() => {
-        const node = createEmptyNode(t)
-        node.loc = createMockLocation()
-
+        const node = createEmptyNodeWithLocation(t)
         const result = processJsxElement(node, createTestContext(), t)
 
         expect(result).toBe(true)
@@ -146,9 +148,7 @@ describe("jsx-tagger", () => {
 
     it.effect("adds path attribute when element has other attributes", () =>
       Effect.sync(() => {
-        const node = createNodeWithClassName(t)
-        node.loc = createMockLocation(15, 2)
-
+        const node = createNodeWithClassNameAndLocation(t)
         const result = processJsxElement(node, createTestContext(), t)
 
         expect(result).toBe(true)
@@ -192,8 +192,7 @@ describe("jsx-tagger", () => {
 
     it.effect("is truly idempotent - processing twice produces same result", () =>
       Effect.sync(() => {
-        const node = createEmptyNode(t)
-        node.loc = createMockLocation()
+        const node = createEmptyNodeWithLocation(t)
 
         // First processing
         const result1 = processJsxElement(node, createTestContext(), t)

packages/app/tests/core/jsx-test-fixtures.ts

@@ -47,3 +47,38 @@ export const createNodeWithClassName = (
  */
 export const createEmptyNode = (types: typeof t): t.JSXOpeningElement =>
   types.jsxOpeningElement(types.jsxIdentifier("div"), [])
+
+/**
+ * Creates an empty JSX opening element with location info for testing.
+ * Combines node creation and location setup to reduce duplication.
+ *
+ * @pure true
+ * @complexity O(1)
+ */
+export const createEmptyNodeWithLocation = (
+  types: typeof t,
+  line = 10,
+  column = 5
+): t.JSXOpeningElement => {
+  const node = createEmptyNode(types)
+  node.loc = createMockLocation(line, column)
+  return node
+}
+
+/**
+ * Creates a JSX opening element with className attribute and location info for testing.
+ * Combines node creation and location setup to reduce duplication.
+ *
+ * @pure true
+ * @complexity O(1)
+ */
+export const createNodeWithClassNameAndLocation = (
+  types: typeof t,
+  className = "container",
+  line = 15,
+  column = 2
+): t.JSXOpeningElement => {
+  const node = createNodeWithClassName(types, className)
+  node.loc = createMockLocation(line, column)
+  return node
+}

packages/app/tests/shell/babel-plugin-config.test.ts

@@ -4,7 +4,7 @@ import { Effect } from "effect"
 import path from "node:path"
 
 import { componentTaggerBabelPlugin } from "../../src/shell/babel-plugin.js"
-import { expectPathAttribute, transformJsx } from "./babel-test-utils.js"
+import { expectPathAttribute, transformAndValidateJsx, transformJsx } from "./babel-test-utils.js"
 
 // CHANGE: extract plugin configuration and rootDir tests to separate file.
 // WHY: comply with max-lines ESLint rule (300 lines limit).
@@ -77,16 +77,13 @@ describe("babel-plugin configuration", () => {
     it.effect("uses custom attribute name when provided", () =>
       Effect.sync(() => {
         const code = "const App = () => { return <div>Hello</div> }"
-        const testFilename = path.resolve("/project", "src/App.tsx")
 
-        const result = transformJsx(code, testFilename, {
-          rootDir: "/project",
+        const { code: transformedCode } = transformAndValidateJsx(code, "src/App.tsx", {
           attributeName: "custom-path"
         })
 
-        expect(result).not.toBeNull()
-        expect(result?.code).toContain("custom-path=\"src/App.tsx:")
-        expect(result?.code).not.toContain("data-path=")
+        expect(transformedCode).toContain("custom-path=\"src/App.tsx:")
+        expect(transformedCode).not.toContain("data-path=")
       }))
 
     it.effect("respects idempotency with custom attribute name", () =>
@@ -96,19 +93,14 @@ describe("babel-plugin configuration", () => {
             return <div custom-path="existing:1:0">Hello</div>
           }
         `
-        const testFilename = path.resolve("/project", "src/App.tsx")
-
-        const result = transformJsx(code, testFilename, {
-          rootDir: "/project",
+        const { expectContains, expectDataPathCount } = transformAndValidateJsx(code, "src/App.tsx", {
           attributeName: "custom-path"
         })
 
-        expect(result).not.toBeNull()
         // Should keep the existing custom-path attribute
-        expect(result?.code).toContain("custom-path=\"existing:1:0\"")
+        expectContains("custom-path=\"existing:1:0\"")
         // Count custom-path attributes - should only be one
-        const pathMatches = result?.code?.match(/custom-path="/g)
-        expect(pathMatches?.length).toBe(1)
+        expectDataPathCount(1)
       }))
   })
 

packages/app/tests/shell/babel-plugin-transformations.test.ts

@@ -1,8 +1,7 @@
-import { describe, expect, it } from "@effect/vitest"
+import { describe, it } from "@effect/vitest"
 import { Effect } from "effect"
-import path from "node:path"
 
-import { transformJsx } from "./babel-test-utils.js"
+import { transformAndValidateJsx } from "./babel-test-utils.js"
 
 // CHANGE: extract JSX transformation tests to separate file.
 // WHY: comply with max-lines ESLint rule (300 lines limit).
@@ -20,13 +19,10 @@ describe("babel-plugin JSX transformations", () => {
           return <div>Hello</div>
         }
       `
-      const testFilename = path.resolve("/project", "src/App.tsx")
+      const { expectContains } = transformAndValidateJsx(code, "src/App.tsx")
 
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
-
-      expect(result).not.toBeNull()
-      expect(result?.code).toContain("data-path=\"src/App.tsx:")
-      expect(result?.code).toContain("<div")
+      expectContains("data-path=\"src/App.tsx:")
+      expectContains("<div")
     }))
 
   it.effect("transforms multiple JSX elements", () =>
@@ -41,15 +37,10 @@ describe("babel-plugin JSX transformations", () => {
           )
         }
       `
-      const testFilename = path.resolve("/project", "src/App.tsx")
-
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
+      const { expectDataPathMinCount } = transformAndValidateJsx(code, "src/App.tsx")
 
-      expect(result).not.toBeNull()
       // Should contain data-path attributes for div, header, and main
-      const pathMatches = result?.code?.match(/data-path="src\/App\.tsx:\d+:\d+"/g)
-      expect(pathMatches).toBeDefined()
-      expect(pathMatches?.length).toBeGreaterThanOrEqual(3)
+      expectDataPathMinCount(3)
     }))
 
   it.effect("does not add duplicate data-path attribute (idempotency)", () =>
@@ -59,16 +50,12 @@ describe("babel-plugin JSX transformations", () => {
           return <div data-path="existing:1:0">Hello</div>
         }
       `
-      const testFilename = path.resolve("/project", "src/App.tsx")
-
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
+      const { expectContains, expectDataPathCount } = transformAndValidateJsx(code, "src/App.tsx")
 
-      expect(result).not.toBeNull()
       // Should keep the existing data-path attribute
-      expect(result?.code).toContain("data-path=\"existing:1:0\"")
+      expectContains("data-path=\"existing:1:0\"")
       // Count data-path attributes - should only be one
-      const pathMatches = result?.code?.match(/data-path="/g)
-      expect(pathMatches?.length).toBe(1)
+      expectDataPathCount(1)
     }))
 
   it.effect("does not interfere with other path-like attributes", () =>
@@ -78,15 +65,12 @@ describe("babel-plugin JSX transformations", () => {
           return <img src="/image.png" alt="test" />
         }
       `
-      const testFilename = path.resolve("/project", "src/App.tsx")
+      const { expectContains } = transformAndValidateJsx(code, "src/App.tsx")
 
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
-
-      expect(result).not.toBeNull()
       // Should preserve src attribute
-      expect(result?.code).toContain("src=\"/image.png\"")
+      expectContains("src=\"/image.png\"")
       // Should add data-path attribute
-      expect(result?.code).toContain("data-path=\"src/App.tsx:")
+      expectContains("data-path=\"src/App.tsx:")
     }))
 
   it.effect("handles JSX with existing attributes", () =>
@@ -96,17 +80,14 @@ describe("babel-plugin JSX transformations", () => {
           return <button className="btn" id="submit" onClick={handleClick}>Click</button>
         }
       `
-      const testFilename = path.resolve("/project", "src/components/Button.tsx")
-
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
+      const { expectContains } = transformAndValidateJsx(code, "src/components/Button.tsx")
 
-      expect(result).not.toBeNull()
       // Should preserve existing attributes
-      expect(result?.code).toContain("className=\"btn\"")
-      expect(result?.code).toContain("id=\"submit\"")
-      expect(result?.code).toContain("onClick={handleClick}")
+      expectContains("className=\"btn\"")
+      expectContains("id=\"submit\"")
+      expectContains("onClick={handleClick}")
       // Should add data-path attribute
-      expect(result?.code).toContain("data-path=\"src/components/Button.tsx:")
+      expectContains("data-path=\"src/components/Button.tsx:")
     }))
 
   it.effect("handles self-closing JSX elements", () =>
@@ -116,13 +97,10 @@ describe("babel-plugin JSX transformations", () => {
           return <input type="text" />
         }
       `
-      const testFilename = path.resolve("/project", "src/App.tsx")
-
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
+      const { expectContains } = transformAndValidateJsx(code, "src/App.tsx")
 
-      expect(result).not.toBeNull()
-      expect(result?.code).toContain("data-path=\"src/App.tsx:")
-      expect(result?.code).toContain("type=\"text\"")
+      expectContains("data-path=\"src/App.tsx:")
+      expectContains("type=\"text\"")
     }))
 
   it.effect("handles nested JSX components", () =>
@@ -142,15 +120,10 @@ describe("babel-plugin JSX transformations", () => {
           )
         }
       `
-      const testFilename = path.resolve("/project", "src/pages/Page.tsx")
+      const { expectDataPathMinCount } = transformAndValidateJsx(code, "src/pages/Page.tsx")
 
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
-
-      expect(result).not.toBeNull()
-      // All components should be tagged
-      const pathMatches = result?.code?.match(/data-path="src\/pages\/Page\.tsx:\d+:\d+"/g)
-      expect(pathMatches).toBeDefined()
-      expect(pathMatches?.length).toBeGreaterThanOrEqual(6) // Layout, Header, Logo, Nav, Content, Article
+      // All components should be tagged: Layout, Header, Logo, Nav, Content, Article
+      expectDataPathMinCount(6)
     }))
 
   it.effect("handles JSX fragments", () =>
@@ -165,14 +138,10 @@ describe("babel-plugin JSX transformations", () => {
           )
         }
       `
-      const testFilename = path.resolve("/project", "src/App.tsx")
-
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
+      const { expectDataPathMinCount } = transformAndValidateJsx(code, "src/App.tsx")
 
-      expect(result).not.toBeNull()
-      // Fragments don't get tagged, but their children do
-      const pathMatches = result?.code?.match(/data-path="/g)
-      expect(pathMatches?.length).toBeGreaterThanOrEqual(2) // Two div elements
+      // Fragments don't get tagged, but their children do (two div elements)
+      expectDataPathMinCount(2)
     }))
 
   it.effect("handles JSX with spread attributes", () =>
@@ -182,13 +151,10 @@ describe("babel-plugin JSX transformations", () => {
           return <div {...props}>Content</div>
         }
       `
-      const testFilename = path.resolve("/project", "src/App.tsx")
-
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
+      const { expectContains } = transformAndValidateJsx(code, "src/App.tsx")
 
-      expect(result).not.toBeNull()
-      expect(result?.code).toContain("{...props}")
-      expect(result?.code).toContain("data-path=\"src/App.tsx:")
+      expectContains("{...props}")
+      expectContains("data-path=\"src/App.tsx:")
     }))
 
   it.effect("handles TypeScript JSX generics", () =>
@@ -198,26 +164,20 @@ describe("babel-plugin JSX transformations", () => {
           return <div>Generic Component</div>
         }
       `
-      const testFilename = path.resolve("/project", "src/Generic.tsx")
+      const { expectContains } = transformAndValidateJsx(code, "src/Generic.tsx")
 
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
-
-      expect(result).not.toBeNull()
-      expect(result?.code).toContain("data-path=\"src/Generic.tsx:")
+      expectContains("data-path=\"src/Generic.tsx:")
     }))
 
   it.effect("correctly formats data-path with line and column", () =>
     Effect.sync(() => {
       const code = `function App() {
   return <div>Test</div>
 }`
-      const testFilename = path.resolve("/project", "src/App.tsx")
-
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
+      const { expectMatch } = transformAndValidateJsx(code, "src/App.tsx")
 
-      expect(result).not.toBeNull()
       // The data-path should contain line 2 (where <div> is) and column number
-      expect(result?.code).toMatch(/data-path="src\/App\.tsx:2:\d+"/)
+      expectMatch(/data-path="src\/App\.tsx:2:\d+"/)
     }))
 
   it.effect("handles components with multiple props on multiple lines", () =>
@@ -235,13 +195,10 @@ describe("babel-plugin JSX transformations", () => {
           )
         }
       `
-      const testFilename = path.resolve("/project", "src/App.tsx")
-
-      const result = transformJsx(code, testFilename, { rootDir: "/project" })
+      const { expectContains } = transformAndValidateJsx(code, "src/App.tsx")
 
-      expect(result).not.toBeNull()
-      expect(result?.code).toContain("data-path=\"src/App.tsx:")
-      expect(result?.code).toContain("className=\"primary\"")
-      expect(result?.code).toContain("onClick={handleClick}")
+      expectContains("data-path=\"src/App.tsx:")
+      expectContains("className=\"primary\"")
+      expectContains("onClick={handleClick}")
     }))
 })