HN
Today

Show HN: ProofShot – Give AI coding agents eyes to verify the UI they build

ProofShot is an open-source CLI tool designed to give AI coding agents 'eyes' to visually verify the UI they build, addressing the critical gap where agents generate code but cannot see its live rendering or errors. It integrates seamlessly with any AI agent via simple shell commands, packaging browser interactions, video, screenshots, and error logs into an easily reviewable, self-contained HTML file. This innovation empowers developers to quickly assess AI-generated UI work, streamlining the development and review process by providing concrete visual evidence.

6
Score
1
Comments
#3
Highest Rank
7h
on Front Page
First Seen
Mar 24, 8:00 AM
Last Seen
Mar 24, 8:00 PM
Rank Over Time
3356161823

The Lowdown

ProofShot is an innovative open-source command-line interface (CLI) tool designed to bridge a significant gap in AI-assisted UI development. It tackles the problem of AI coding agents generating user interface code without the ability to visually inspect their output in a browser, leading to blind spots regarding layout issues or runtime errors. ProofShot provides a mechanism for AI agents to interact with a browser, record the session, and gather visual and technical evidence for human review.

  • Problem Solved: AI agents typically write code but lack visual feedback on the UI they create, making it impossible for them to detect visual regressions or console errors.
  • Core Functionality: ProofShot enables an AI agent to launch a dev server, open a headless Chromium browser, navigate, click, fill forms, and take screenshots, recording the entire process.
  • Output: It bundles all recorded evidence—including video playback, screenshots, and error logs (console and server)—into a single, self-contained HTML file for easy review.
  • Ease of Use: The workflow involves three simple commands: proofshot start to initiate recording and launch the dev server, proofshot exec for the AI agent's interactive commands, and proofshot stop to collect artifacts and generate the proof bundle.
  • Key Features: Includes full browser session recording with automatic dead-time trimming, comprehensive error detection (browser console and server logs across multiple languages), an interactive timeline viewer synced with video and actions, and generation of PR-ready artifacts like SUMMARY.md and visual diff comparisons.
  • Agent Agnostic: The tool works with any AI coding agent (e.g., Claude Code, Cursor, Codex) as it operates through standard shell commands, making it widely compatible.
  • Purpose: It is explicitly not a testing framework; instead, it provides verifiable evidence for human developers to review, eliminating the need to manually open the browser to check AI-generated work.

By offering a practical, agent-agnostic solution, ProofShot empowers developers to efficiently oversee and validate the visual integrity of UI components built by AI agents, making the AI development workflow more transparent and reliable.