# You give agents a working preview

Give each agent a preview it can open, identify, test, and show to you. You will connect one isolated change to running software and readable evidence.

## A preview needs running software

Source files can describe an interface, yet they cannot show whether its live behavior works. Next.js directs agents to work against a running server during development <a href="#cite-c0345">in its agent guide</a>. Graham Neubig describes an agent running an application and browsing its interface directly <a href="#cite-c0377">in his production talk</a>. The preview address must work from the machine where your agent actually performs the task.

## Each change needs an isolated preview

Start with your project's supported preview method, so every participant follows one dependable route. OpenAI made its application bootable for each isolated checkout, according to <a href="#cite-c0521">Ryan Lopopolo's account</a>. Confirm the served change before using any observed result to guide your decision. Give independent previews separate mutable data, because different addresses can still share accounts or records. Name who owns temporary state and when the supported cleanup process should remove it.

## The agent tests the real flow

Opening the preview proves reachability, while completing the main journey tests the behavior you need. Boris Cherny and Catherine Wu describe Claude starting a desktop application and testing it through computer use <a href="#cite-c0194">in their retrospective</a>. Give the agent supported test access, while keeping normal access protection in place. A successful page load cannot establish that the feature completes its intended outcome. Preview creation may require deployment authority, which this lesson does not grant.

## Evidence must reach the reviewer

Matt Pocock recommends attaching a video of the working feature to its proposed change <a href="#cite-c0252">in his agent-building discussion</a>. Choose evidence that shows the behavior under review and remains readable outside the producing machine. Use a recording for movement, or a screenshot when one stable state carries the result. Include the tested change and journey, so the reviewer can connect evidence with the correct preview. A recording trapped on another machine leaves the entire review handoff unfinished.

## A fresh run confirms the preview

Have a fresh agent obtain the preview without relying on your unstated setup knowledge. It should confirm the served change, complete the journey, and return evidence you can open. If any step needs manual setup, record that limit beside the result. A passing journey verifies only the behavior and state that the agent actually exercised. Cleanup must preserve useful evidence and avoid removing shared state owned by another task.

## The sources show previews in use

<a href="#cite-c0345">Next.js</a> and <a href="#cite-c0377">Graham Neubig</a> show agents checking behavior directly through running applications. <a href="#cite-c0194">Boris Cherny and Catherine Wu</a> show the same pattern with a desktop application. <a href="#cite-c0521">Ryan Lopopolo</a> adds isolated previews, while <a href="#cite-c0252">Matt Pocock</a> shows evidence a reviewer can consume. These sources demonstrate practices and examples without measuring review speed or proving every setup works.

<ol id="citations"><li id="cite-c0194">Boris Cherny and Catherine Wu, video, <a href="https://www.youtube.com/watch?v=Hth_tLaC2j8&t=177s">Reflecting on a year of Claude Code</a>, at 02:57. "Claude actually spins up a local desktop app and it uses computer use"</li><li id="cite-c0252">Matt Pocock, video, <a href="https://www.youtube.com/watch?v=nQwJVHCtDDY&t=2020s">Building AI Coding Agents with Matt Pocock</a>, at 33:40. "you just have a video on the PR of the thing working."</li><li id="cite-c0345">Next.js, docs, <a href="https://nextjs.org/docs/app/guides/ai-agents#:~:text=let%20the%20agent%20work%20against%20the%20running%20server.">Guides: AI Coding Agents | Next.js</a>, at Run next dev and let the agent work. "let the agent work against the running server."</li><li id="cite-c0377">Graham Neubig, other, <a href="https://home.mlops.community/public/videos/deploying-autonomous-coding-agents-graham-neubig-agents-in-production-2024-11-20#:~:text=run%20the%20Flask%20app%2C%20and%20then%20browse%20to%20the%20Flask%20app">Deploying Autonomous Coding Agents // Graham Neubig // Agents in Production</a>, at 00:08:06. "run the Flask app, and then browse to the Flask app"</li><li id="cite-c0521">Ryan Lopopolo, blog post, <a href="https://openai.com/index/harness-engineering/#:~:text=we%20made%20the%20app%20bootable%20per%20git%20worktree%2C%20so%20Codex%20could%20launch%20and%20drive">Harness engineering: leveraging Codex in an agent-first world</a>, at For example, we made the app bootable per. "we made the app bootable per git worktree, so Codex could launch and drive"</li></ol>

<p id="next-action">Run one fresh-agent check that confirms the served change, main journey, and readable evidence.</p>
