Overview
Web Preview opens a development service through the active SSH connection after forwarding its local port. This keeps the preview close to the terminal where the server and coding agent are running.
You can move between implementation instructions and visual verification on the same device, which shortens the feedback loop for responsive layouts, content changes, forms, and interaction states.
When to use it
- Open a Vite, Next.js, Astro, Rails, Django, or other development server started by an agent on the remote Host.
- Verify layout, typography, colors, images, forms, and navigation immediately after a code change.
- Check mobile breakpoints on the actual iPhone or iPad being used to control the agent.
- Review loading, empty, error, hover-independent, and touch interaction states before giving the next instruction.
- Keep a private development port inside the SSH workflow instead of exposing the dev server directly to a public network.
Close the agent-to-browser feedback loop
Ask the agent to change a component, open the forwarded dev server, inspect the result, and return with a precise correction—all from the same mobile workflow.
Test on the actual mobile viewport
Verify breakpoints, touch targets, sticky elements, input focus, overflow, and safe-area behavior on the iPhone or iPad being used rather than relying only on desktop emulation.
Review non-happy-path states
Open loading, empty, validation, permission, network-error, and long-content states so the next prompt can reference an observed problem instead of a general visual request.
How it works
- Start the development server on the remote Host.
- Forward the service port through the active connection.
- Open Web Preview, inspect the change, and return to the terminal with feedback.
Practical guidance
Bind the dev server to an address accepted by your framework and confirm the expected port. Stop unused servers and forwards when the review is complete.