Decompose: Break down #6 into implementable work units #7

New issue

Closed

opened 2026-05-16 04:35:41 +00:00 by Mark · 1 comment

Mark commented

2026-05-16 04:35:41 +00:00

Owner

Decomposition of #6: [smoke-test] Test coverage review: 75 source files, 1 test files (1.3%)

This issue decomposes the parent feature into independently implementable phases.

P1: Foundation: Install vitest, configure vite.config.ts with test block + coverage, add test script to package.json, create vitest setup file for JSDOM + testing-library matchers, write a smoke test to verify the runner works.

Files: package.json, vite.config.ts, src/test/setup.ts

P2: Core Logic Tests: Unit tests for pure-data modules with no rendering dependency — stockLibrary.ts (material properties, dimension lookups, stock length calculations), templateEngine.ts (parametric generation for all 4 templates), utils.ts (cn/clsx helpers), and type validation in types/index.ts.

Files: src/data/stockLibrary.ts, src/data/templateEngine.ts, src/lib/utils.ts, src/types/index.ts
Depends on: P1

P3: Store Tests: State management tests for the Zustand store (useStore.ts) covering furniture parameter updates, part selection, template switching, and BOM/cut-list state transitions. Also test the use-mobile hook.

Files: src/store/useStore.ts, src/hooks/use-mobile.ts
Depends on: P1

P4: App Shell Tests: Render tests for the top-level app structure — App.tsx (layout + routing), main.tsx (entry point), Home.tsx (page composition). Verify all sections render without crash. Mock Three.js canvas and heavy 3D dependencies.

Files: src/App.tsx, src/main.tsx, src/pages/Home.tsx
Depends on: P2, P3

Files: src/components/panels/LeftSidebar.tsx, src/components/panels/RightSidebar.tsx, src/components/panels/BOMPanel.tsx, src/components/panels/CutListPanel.tsx, src/components/Navbar.tsx, src/components/BottomToolbar.tsx, src/components/StatusBar.tsx, src/components/PartTooltip.tsx
Depends on: P3

P6: Three.js 3D Component Tests: Render tests for the 3D viewport — Viewport3D (OrbitControls + environment + selection), AssemblyRenderer (3D instancing of furniture parts), WoodMaterial (procedural wood texture shader). These require heavy mocking of @react-three/fiber and three.js internals; use vi.mock at the module level to avoid canvas dependency

Files: src/components/three/Viewport3D.tsx, src/components/three/AssemblyRenderer.tsx, src/components/three/WoodMaterial.tsx
Depends on: P4

Post-completion: When each phase is complete, comment on #6 with a summary of what was implemented.

## Decomposition of #6: [smoke-test] Test coverage review: 75 source files, 1 test files (1.3%) This issue decomposes the parent feature into independently implementable phases. --- ### P1: Foundation: Install vitest, configure vite.config.ts with test block + coverage, add test script to package.json, create vitest setup file for JSDOM + testing-library matchers, write a smoke test to verify the runner works. **Files:** package.json, vite.config.ts, src/test/setup.ts ### P2: Core Logic Tests: Unit tests for pure-data modules with no rendering dependency — stockLibrary.ts (material properties, dimension lookups, stock length calculations), templateEngine.ts (parametric generation for all 4 templates), utils.ts (cn/clsx helpers), and type validation in types/index.ts. **Files:** src/data/stockLibrary.ts, src/data/templateEngine.ts, src/lib/utils.ts, src/types/index.ts **Depends on:** P1 ### P3: Store Tests: State management tests for the Zustand store (useStore.ts) covering furniture parameter updates, part selection, template switching, and BOM/cut-list state transitions. Also test the use-mobile hook. **Files:** src/store/useStore.ts, src/hooks/use-mobile.ts **Depends on:** P1 ### P4: App Shell Tests: Render tests for the top-level app structure — App.tsx (layout + routing), main.tsx (entry point), Home.tsx (page composition). Verify all sections render without crash. Mock Three.js canvas and heavy 3D dependencies. **Files:** src/App.tsx, src/main.tsx, src/pages/Home.tsx **Depends on:** P2, P3 ### P5: Panel & Toolbar Component Tests: Business-logic-heavy UI components — LeftSidebar (furniture parameters), RightSidebar (part inspector), BOMPanel (bill of materials rendering), CutListPanel (cut optimization display), Navbar, BottomToolbar, StatusBar, PartTooltip. **Files:** src/components/panels/LeftSidebar.tsx, src/components/panels/RightSidebar.tsx, src/components/panels/BOMPanel.tsx, src/components/panels/CutListPanel.tsx, src/components/Navbar.tsx, src/components/BottomToolbar.tsx, src/components/StatusBar.tsx, src/components/PartTooltip.tsx **Depends on:** P3 ### P6: Three.js 3D Component Tests: Render tests for the 3D viewport — Viewport3D (OrbitControls + environment + selection), AssemblyRenderer (3D instancing of furniture parts), WoodMaterial (procedural wood texture shader). These require heavy mocking of @react-three/fiber and three.js internals; use vi.mock at the module level to avoid canvas dependency **Files:** src/components/three/Viewport3D.tsx, src/components/three/AssemblyRenderer.tsx, src/components/three/WoodMaterial.tsx **Depends on:** P4 --- **Post-completion:** When each phase is complete, comment on #6 with a summary of what was implemented.