preview-server

What problem does it solve?

Preview Server ensures your AI-generated HTML/CSS/JS mockups can be safely reviewed in a real browser session with hot-reload feedback, while collecting the evidence needed before claiming the preview is “ready” for handoff or approval.

Core Features & Use Cases

• Spawns or reuses a managed localhost preview: Starts the Supervibe preview daemon for a renderable mockup root and returns the managed URL to the user.
• Verifies preview quality via browser evidence: Confirms HTTP availability and the presence of the feedback overlay entrypoint (e.g., feedback toggle/button) so design feedback is captured reliably.
• Supports frameworks and multi-variant roots: Proxies an existing dev server with Supervibe injection for feedback, and verifies each variant URL independently when a variant manifest exists.
• Optionally captures Playwright screenshots: Saves a screenshot next to the mockup files when requested.
• Adds runtime proof for advanced visuals: Requires additional checks for motion/video/WebGL/canvas/Three.js to avoid using “a live URL” as a substitute for rendering evidence.

Quick Start

Run the preview-server skill after your agent produces HTML/CSS/JS mockup files, then ask the AI to open the managed preview link so you can click around and leave feedback.