Define demo types, schema, and settings

[acreeger]

Summary

Create the foundational types, Zod schemas, and settings configuration for the demo verification feature.

Context

Part of Epic #510 (Web Project Demo Verification). This is foundational work that other issues depend on.

Scope

TypeScript Types

interface DemoStep {
  action: 'navigate' | 'click' | 'fill' | 'wait' | 'press' | 'screenshot'
  target?: string  // selector or URL
  value?: string   // for fill/press actions
  description: string
}

interface DemoAssertion {
  type: 'textVisible' | 'elementExists' | 'urlMatches'
  value: string
  timeout?: number
}

interface DemoScript {
  name: string
  steps: (DemoStep | DemoAssertion)[]
}

Zod Schema

• Validate DemoScript structure
• Security: URL validation - only allow localhost, 127.0.0.1, or relative paths
• Selector support: text-based (text=Submit), test-id ([data-testid=...]), CSS

Settings (SettingsManager)

Add demo section:

demo: {
  enabled: z.boolean().default(false),
  headless: z.boolean().default(true),
  baseUrl: z.string().default('http://localhost:3000'),
  devServerCommand: z.string().optional(),
  videoDir: z.string().default('.iloom/demos/'),
  timeout: z.number().default(30000),
}

Documentation

• Update README with demo settings section
• Document each setting with default values and examples

Acceptance Criteria

• TypeScript types exported from src/types/demo.ts
• Zod schema validates correct scripts and rejects invalid/malicious URLs
• Settings schema added to SettingsManager
• Settings load from .iloom/settings.json
• README documents all demo settings
• Unit tests for schema validation (valid and invalid cases)

Dependencies

None - this is foundational work.

Scope Boundaries

NOT included:

• Actual Playwright integration (Issue Core Git Worktree Management Module #2)
• Service implementations (Issues GitHub Integration Module #3, Environment Management Module #4, Database Branch Management (Neon) #5)