PandevPandev
Features

Opening the Browser Preview

  • Press Cmd+B / Ctrl+B
  • Click the Browser icon in the session header

Requirements

To use the browser preview, your project needs:

  1. A dev server configured — Set during project setup (the dev command and port)
  2. The dev server running — Start it from the project card on the Dashboard

If no dev server is configured, the browser panel shows instructions to set one up.

Starting the Dev Server

You can start the dev server from multiple places:

  • Dashboard — Click the play button on your project card
  • Session header — The dev server indicator shows the port and status
  • Terminal — Run your dev command manually (e.g., npm run dev)

The dev server status indicator shows:

  • Gray — Not running
  • Amber (pulsing) — Starting up
  • Green — Running and healthy
  • Red — Error

Browser Panel Features

Once the dev server is running, the browser preview shows:

  • Embedded webview — Your app rendered in a webview inside Pandev
  • URL bar — Shows the current URL (e.g., http://localhost:3000)
  • Refresh — Reload the page
  • Screenshot — Capture a screenshot of the preview and attach it to your chat (useful for asking Claude about visual issues)

Per-Project Persistence

Each project has its own browser session with isolated cookies and storage. This means:

  • Login sessions are preserved per project
  • Local storage is separate between projects
  • Cookies don't leak between different projects

Browser MCP

When the browser preview is open, Pandev automatically starts a Browser MCP server that gives Claude the ability to interact with your app:

  • Navigate to URLs
  • Click elements
  • Type text
  • Take screenshots
  • Read console logs
  • Scroll the page
  • Evaluate JavaScript

This means Claude can see and interact with your running app when debugging UI issues or testing features. The MCP server tools are automatically registered and available to Claude.

The Browser MCP server stops automatically when you close the browser preview.

Dev Server Controls on Dashboard

The Dashboard project cards show dev server status and controls:

ButtonAction
PlayStart the dev server
StopStop the dev server
RestartStop and restart
Kill + StartKill the port (if stuck) and restart
OpenOpen in the browser preview

On this page