- Next.js 14+ with App Router and TypeScript - Tailwind CSS and ShadCN UI styling - Zustand state management - Dexie.js for IndexedDB (local-first data) - Auth.js v5 for authentication - BMAD framework integration Co-Authored-By: Claude <noreply@anthropic.com>
3.7 KiB
3.7 KiB
ATDD Checklist - Epic 3, Story 3.3: Offline Action Queueing
Date: 2026-01-26 Author: BMad TEA Agent Primary Test Level: Integration (Sync Logic)
Story Summary
As a user with intermittent connectivity I want my actions (save, delete) to be queued when offline So that I don't lose data and my intent is preserved until I reconnect.
Acceptance Criteria
- Queue Actions Offline: When offline, user actions (
SAVE_DRAFT,DELETE_ENTRY) must be added to a persistentsyncQueuein Dexie. - Replay Actions Online: When network restores, pending actions in
syncQueuemust be processed in order (FIFO). - Retry Logic: Failed actions should be retried with exponential backoff before being marked as failed.
Failing Tests Created (RED Phase)
Integration Tests (2 files)
File: tests/integration/offline-action-queueing.test.ts
- ✅ Test: should enqueue SAVE_DRAFT action when offline
- Status: RED -
SyncManagerlogic not connected to UI/Service - Verifies:
saveDraftaction is added to DB with correct payload.
- Status: RED -
- ✅ Test: should enqueue DELETE_ENTRY action when offline
- Status: RED - Failing placeholder
- Verifies:
deleteDraftaction is added to DB.
File: tests/integration/sync-action-replay.test.ts
- ✅ Test: should process pending actions when network restores
- Status: RED -
processQueuenot triggered or implemented - Verifies: Queue drains and actions execute.
- Status: RED -
Unit Tests (1 file)
File: tests/unit/services/sync-manager.test.ts
- ✅ Test: queueAction adds to DB
- Status: RED - Implementation missing
- Verifies: Service method calls DB correctly.
- ✅ Test: processQueue processes items
- Status: RED - Implementation missing
- Verifies: FIFO processing and status updates.
Data Factories Created
Uses existing faker patterns (mocking data payload directly in tests for this infrastructure story).
Mock Requirements
SyncManager Service:
- Mocks Dexie
db.syncQueuefor unit tests. - Simulates server latency (500ms) for MVP
executeAction.
Implementation Checklist
Test: Unit Tests (SyncManager)
File: tests/unit/services/sync-manager.test.ts
- Implement
SyncManagerclass structure - Implement
queueActionmethod - Implement
processQueuemethod - Implement
executeAction(Simulated Sync) - Run test:
npx vitest run sync-manager.test.ts - ✅ Test passes (green phase)
Test: Integration Tests (Offline Queueing)
File: tests/integration/offline-action-queueing.test.ts
- Connect UI/Service 'Save' action to
SyncManager.queueActionwhen offline - Verify
navigator.onLinecheck logic - Run test:
npx playwright test offline-action-queueing.test.ts - ✅ Test passes (green phase)
Test: Integration Tests (Replay)
File: tests/integration/sync-action-replay.test.ts
- Add
onlineevent listener initialization - Trigger
processQueueon network restore - Run test:
npx playwright test sync-action-replay.test.ts - ✅ Test passes (green phase)
Estimated Effort: 4 hours
Red-Green-Refactor Workflow
RED Phase (Complete) ✅
- ✅ All tests written and failing
- ✅ Implementation checklist created
GREEN Phase (DEV Team - Next Steps)
- Pick one failing test (start with Unit Tests)
- Implement minimal code in
sync-manager.ts - Run the test (
npx vitest ...) - Move to Integration tests once unit logic is solid
Running Tests
# Run Unit Tests
npx vitest run sync-manager.test.ts
# Run Integration Tests
npx playwright test offline-action-queueing.test.ts
npx playwright test sync-action-replay.test.ts