docs(20): create integration tests phase plan

Phase 20: Integration Tests - 2 plans created - 6 total tasks defined - Tests cover getConnectedInputs, validateWorkflow, topological sort, data flow, error handling, and connection validation - Ready for execution Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
6 months ago · 7ef0f63d53
3 changed files with 299 additions and 2 deletions
--- a/.planning/ROADMAP.md
+++ b/.planning/ROADMAP.md
@ -258,10 +258,11 @@ Plans:
 **Goal**: End-to-end workflow execution tests covering node connections and data flow
 **Depends on**: Phase 19
 **Research**: Unlikely (internal testing patterns)
-**Plans**: TBD
+**Plans**: 2 plans

 Plans:
- [ ] 20-01: TBD (run /gsd:plan-phase 20 to break down)
+- [ ] 20-01: Store integration tests (getConnectedInputs, validateWorkflow, topological sort)
+- [ ] 20-02: Workflow execution tests (data flow, error handling, connection validation)

 #### Phase 21: Fix Image Input & Deduplication Issues

--- a/.planning/phases/20-integration-tests/20-01-PLAN.md
+++ b/.planning/phases/20-integration-tests/20-01-PLAN.md
@ -0,0 +1,147 @@
+---
+phase: 20-integration-tests
+plan: 01
+type: execute
+---
+
+<objective>
+Test workflowStore integration functions that handle node connections and data flow.
+
+Purpose: Verify that getConnectedInputs correctly extracts data from connected nodes and validateWorkflow properly checks workflow integrity.
+Output: Comprehensive test suite for workflowStore integration functions with full coverage of connection scenarios.
+</objective>
+
+<execution_context>
+~/.claude/get-shit-done/workflows/execute-phase.md
+~/.claude/get-shit-done/templates/summary.md
+</execution_context>
+
+<context>
+@.planning/PROJECT.md
+@.planning/ROADMAP.md
+@src/store/workflowStore.ts
+@src/store/__tests__/ (to be created)
+@src/components/__tests__/WorkflowCanvas.test.tsx (existing patterns)
+</context>
+
+<tasks>
+
+<task type="auto">
+  <name>Task 1: Create workflowStore integration test file with getConnectedInputs tests</name>
+  <files>src/store/__tests__/workflowStore.integration.test.ts</files>
+  <action>
+Create integration tests for getConnectedInputs function covering:
+
+1. **Basic data extraction scenarios:**
+   - Image from imageInput node flows to target
+   - Image from annotation node (outputImage) flows to target
+   - Image from nanoBanana node (outputImage) flows to target
+   - Text from prompt node flows to target
+   - Text from llmGenerate node (outputText) flows to target
+
+2. **Multiple connections:**
+   - Multiple images from different sources collected in images array
+   - Text takes last connected source (not array)
+   - Mix of image and text connections to same node
+
+3. **Dynamic input mapping:**
+   - Handle IDs mapped to schema names when inputSchema present
+   - Multiple image handles (image, image-0, image-1) map to schema names
+   - Multiple text handles (text, text-0, text-1) map to schema names
+   - No schema means no dynamicInputs population
+
+4. **Edge cases:**
+   - No connections returns empty images array and null text
+   - Source node has null output data
+   - Connection to non-existent source node
+
+Test setup: Create a minimal Zustand store with test nodes and edges, call getConnectedInputs directly. Use vi.fn() for mocking, follow existing patterns from component tests.
+
+Do NOT mock the entire workflowStore - use the actual implementation but with controlled test data.
+  </action>
+  <verify>npm test src/store/__tests__/workflowStore.integration.test.ts passes with all scenarios covered</verify>
+  <done>getConnectedInputs tests cover all documented scenarios, tests pass, no TypeScript errors</done>
+</task>
+
+<task type="auto">
+  <name>Task 2: Add validateWorkflow integration tests</name>
+  <files>src/store/__tests__/workflowStore.integration.test.ts</files>
+  <action>
+Add tests for validateWorkflow function to the same test file covering:
+
+1. **Empty workflow:**
+   - Returns invalid with "Workflow is empty" error
+
+2. **nanoBanana node validation:**
+   - Missing text input returns error
+   - Text input connected returns valid
+   - Image input optional (no error if missing)
+
+3. **annotation node validation:**
+   - No image connected and no sourceImage returns error
+   - Image connected returns valid
+   - sourceImage present (manual load) returns valid even without connection
+
+4. **Valid workflow scenarios:**
+   - Simple prompt → nanoBanana → output chain
+   - Complex workflow with multiple node types
+   - Workflow with groups
+
+Use the same test setup pattern - create store with test data, call validateWorkflow.
+  </action>
+  <verify>npm test src/store/__tests__/workflowStore.integration.test.ts passes with validateWorkflow tests</verify>
+  <done>validateWorkflow tests cover all validation scenarios documented in workflowStore.ts</done>
+</task>
+
+<task type="auto">
+  <name>Task 3: Add topological sort integration tests</name>
+  <files>src/store/__tests__/workflowStore.integration.test.ts</files>
+  <action>
+Add tests for topological sort ordering in executeWorkflow. Since executeWorkflow has side effects (API calls), these tests need careful mocking:
+
+1. **Test setup:**
+   - Mock fetch globally to intercept API calls
+   - Mock logger to avoid noise
+   - Use act() wrapper for state updates
+
+2. **Execution order tests:**
+   - Linear chain (A → B → C) executes in order
+   - Multiple dependencies (A, B → C) executes A, B before C
+   - Parallel branches merge correctly
+   - Cycle detection throws error
+
+3. **Pause edge handling:**
+   - Execution stops at node with incoming pause edge
+   - pausedAtNodeId is set correctly
+   - Resuming from paused node skips pause check
+
+4. **Locked group handling:**
+   - Nodes in locked groups are skipped
+   - Non-locked group nodes execute normally
+
+Mock fetch to return success responses for nanoBanana/generateVideo nodes. Focus on testing execution ORDER, not API response handling (that's covered in API route tests).
+  </action>
+  <verify>npm test src/store/__tests__/workflowStore.integration.test.ts passes with topological sort tests</verify>
+  <done>Topological sort tests verify correct execution order for various graph structures</done>
+</task>
+
+</tasks>
+
+<verification>
+Before declaring plan complete:
+- [ ] `npm test src/store/__tests__/workflowStore.integration.test.ts` passes all tests
+- [ ] Tests cover getConnectedInputs, validateWorkflow, and topological sort
+- [ ] No TypeScript errors in test file
+- [ ] `npm run build` succeeds
+</verification>
+
+<success_criteria>
+- All tasks completed
+- All verification checks pass
+- Integration tests provide meaningful coverage of store functions
+- Tests follow existing patterns from component tests
+</success_criteria>
+
+<output>
+After completion, create `.planning/phases/20-integration-tests/20-01-SUMMARY.md`
+</output>
--- a/.planning/phases/20-integration-tests/20-02-PLAN.md
+++ b/.planning/phases/20-integration-tests/20-02-PLAN.md
@ -0,0 +1,149 @@
+---
+phase: 20-integration-tests
+plan: 02
+type: execute
+---
+
+<objective>
+Test end-to-end workflow execution with data flow between nodes and error handling.
+
+Purpose: Verify that workflow execution correctly passes data between connected nodes, handles errors gracefully, and maintains proper state throughout execution.
+Output: Integration tests for full workflow execution scenarios with mocked API responses.
+</objective>
+
+<execution_context>
+~/.claude/get-shit-done/workflows/execute-phase.md
+~/.claude/get-shit-done/templates/summary.md
+</execution_context>
+
+<context>
+@.planning/PROJECT.md
+@.planning/ROADMAP.md
+@.planning/phases/20-integration-tests/20-01-SUMMARY.md
+@src/store/workflowStore.ts
+@src/store/__tests__/workflowStore.integration.test.ts
+</context>
+
+<tasks>
+
+<task type="auto">
+  <name>Task 1: Add workflow execution data flow tests</name>
+  <files>src/store/__tests__/workflowStore.integration.test.ts</files>
+  <action>
+Add integration tests for workflow execution data flow:
+
+1. **Image data flow:**
+   - imageInput → nanoBanana: image reaches generate node
+   - imageInput → annotation → nanoBanana: annotation output reaches generate
+   - Multiple images collected in inputImages array
+
+2. **Text data flow:**
+   - prompt → nanoBanana: text reaches inputPrompt
+   - prompt → llmGenerate → nanoBanana: LLM output becomes generate input
+   - dynamicInputs populated from schema-mapped connections
+
+3. **Mixed data flow:**
+   - prompt + imageInput → nanoBanana: both text and images reach node
+   - Correct handle mapping when node has inputSchema
+
+4. **State updates during execution:**
+   - Node status changes to "loading" during execution
+   - Node status changes to "complete" on success
+   - outputImage/outputText populated from API response
+
+Mock setup:
+- Mock fetch to return controlled responses
+- Mock logger.startSession, logger.endSession
+- Use waitFor() for async state updates
+- Check node data after execution completes
+
+Important: Focus on verifying data REACHES the node correctly via updateNodeData calls. The actual API transformation is tested in API route tests.
+  </action>
+  <verify>npm test src/store/__tests__/workflowStore.integration.test.ts passes with data flow tests</verify>
+  <done>Data flow tests verify images and text correctly pass through node chains</done>
+</task>
+
+<task type="auto">
+  <name>Task 2: Add error handling and edge case tests</name>
+  <files>src/store/__tests__/workflowStore.integration.test.ts</files>
+  <action>
+Add integration tests for error handling and edge cases:
+
+1. **Missing input errors:**
+   - nanoBanana without text input sets error status
+   - generateVideo without model selected sets error status
+   - Execution stops on error (subsequent nodes not executed)
+
+2. **API error handling:**
+   - HTTP error response sets node error status
+   - Network error sets appropriate error message
+   - isRunning set to false on error
+
+3. **Workflow state management:**
+   - isRunning true during execution
+   - isRunning false after completion
+   - currentNodeId updates as each node executes
+   - currentNodeId null after completion
+
+4. **Resume functionality:**
+   - Starting from specific nodeId skips earlier nodes
+   - startFromNodeId finds correct index in sorted order
+   - Resuming from pausedAtNodeId works correctly
+
+Mock fetch to return error responses for error tests. Use waitFor to check final state after async operations complete.
+  </action>
+  <verify>npm test src/store/__tests__/workflowStore.integration.test.ts passes with error handling tests</verify>
+  <done>Error handling tests cover all error scenarios in executeWorkflow</done>
+</task>
+
+<task type="auto">
+  <name>Task 3: Add connection validation integration tests</name>
+  <files>src/store/__tests__/workflowStore.integration.test.ts</files>
+  <action>
+Add integration tests for connection validation logic used by WorkflowCanvas:
+
+1. **Type matching validation:**
+   - image handle accepts image source only
+   - text handle accepts text source only
+   - video handle accepts video source only
+
+2. **Self-connection prevention:**
+   - Node cannot connect to itself
+
+3. **Duplicate connection prevention:**
+   - Same source→target connection cannot be added twice
+
+4. **Handle type inference:**
+   - isImageHandle correctly identifies image handles
+   - isTextHandle correctly identifies text handles
+   - Handles with schema names (image_url, prompt) work correctly
+
+Note: The actual isValidConnection function is in WorkflowCanvas.tsx, but the helpers like isImageHandle/isTextHandle are in getConnectedInputs. Test the integration between handle identification and data extraction.
+
+This can be tested by creating edges with various handle configurations and verifying getConnectedInputs correctly categorizes them.
+  </action>
+  <verify>npm test src/store/__tests__/workflowStore.integration.test.ts passes with connection validation tests</verify>
+  <done>Connection validation tests verify type matching and handle identification</done>
+</task>
+
+</tasks>
+
+<verification>
+Before declaring plan complete:
+- [ ] `npm test src/store/__tests__/workflowStore.integration.test.ts` passes all tests
+- [ ] Tests cover data flow, error handling, and connection validation
+- [ ] No TypeScript errors
+- [ ] `npm run build` succeeds
+- [ ] All tests from Plan 01 still pass
+</verification>
+
+<success_criteria>
+- All tasks completed
+- All verification checks pass
+- Integration tests provide meaningful E2E coverage
+- Phase 20 provides confidence in workflow execution correctness
+</success_criteria>
+
+<output>
+After completion, create `.planning/phases/20-integration-tests/20-02-SUMMARY.md`
+</output>