Skip to content

Add Mock Generation Feature#1

Open
mgorunuch wants to merge 2 commits intomainfrom
claude/add-mock-generation-011CUoYGNqooC4cFyApTTQ3n
Open

Add Mock Generation Feature#1
mgorunuch wants to merge 2 commits intomainfrom
claude/add-mock-generation-011CUoYGNqooC4cFyApTTQ3n

Conversation

@mgorunuch
Copy link
Copy Markdown
Contributor

Add comprehensive mock generation utilities for testing and development:

  • Mock Client: Drop-in replacement for BaseClient that returns mock data
  • Mock Handlers: Create mock handlers from HandlerConfig
  • Mock Context: Generate mock contexts for testing
  • Zod Mock Generator: Automatic mock data generation from Zod schemas
  • Comprehensive Documentation: Full guide and examples

Features:

  • Auto-generates mock data from Zod schemas
  • Supports all common Zod types (primitives, objects, arrays, unions, etc.)
  • Deterministic generation with seed support
  • Spy functionality for tracking calls
  • Network latency simulation
  • Type-safe throughout

Includes:

  • New package: packages/http-mocks/
  • Documentation: docs/guide/mocks.md
  • Examples: examples/mocks/
  • Updated README and build scripts

Add comprehensive mock generation utilities for testing and development:

- **Mock Client**: Drop-in replacement for BaseClient that returns mock data
- **Mock Handlers**: Create mock handlers from HandlerConfig
- **Mock Context**: Generate mock contexts for testing
- **Zod Mock Generator**: Automatic mock data generation from Zod schemas
- **Comprehensive Documentation**: Full guide and examples

Features:
- Auto-generates mock data from Zod schemas
- Supports all common Zod types (primitives, objects, arrays, unions, etc.)
- Deterministic generation with seed support
- Spy functionality for tracking calls
- Network latency simulation
- Type-safe throughout

Includes:
- New package: packages/http-mocks/
- Documentation: docs/guide/mocks.md
- Examples: examples/mocks/
- Updated README and build scripts
Add extensive documentation and practical examples for using mocks in frontend development:

**Documentation Updates:**
- docs/guide/mocks.md: 477 lines of frontend debugging guide
  - Problem/solution overview
  - Quick start for frontend developers
  - Debugging specific scenarios (empty, loading, error, edge cases)
  - Dev tools component pattern
  - Framework-specific examples (React, Vue, Svelte)
  - Pro tips and best practices
  - Storybook integration
  - Debugging checklist

- packages/http-mocks/README.md: Frontend development section
  - Why use mocks for frontend
  - Quick setup guide
  - Scenario testing patterns
  - Dev tools component
  - Framework examples
  - Complete example reference

**New Example:**
- examples/frontend-debugging/: Complete React app demonstrating:
  - Mock/real API client switching
  - Multiple test scenarios (default, empty, error, large, edge, slow)
  - Dev tools panel with runtime toggling
  - TanStack Query integration
  - Realistic project management UI
  - Console debug utilities

**Key Features:**
- ✅ Toggle between mock and real API at runtime
- ✅ Test 6 different scenarios easily
- ✅ Works offline for development
- ✅ Framework-agnostic patterns
- ✅ Production-ready examples

This makes @adi-family/http-mocks incredibly valuable for frontend developers who want to:
- Build UI before backend is ready
- Debug edge cases quickly
- Work offline
- Test error states easily
- Develop in isolation
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants