Live Preview
When you’re building something, you constantly check the result. Normally that means alt-tabbing to a browser, opening its devtools, and switching back. Monday Morning’s Live Preview brings that running output — a web app, docs site, API, or build — directly inside the app, in an embedded child webview, so you never leave your workspace.
What it is
Section titled “What it is”Live Preview renders your project’s running output in a dock alongside your terminals. It’s a real embedded webview, not a screenshot or a static render, so it loads localhost dev servers and external URLs the same way a browser would. One shared preview spans your terminals, like a split view.
The dock can sit on the right, on the bottom, or go fullscreen, and it’s resizable. Cmd/Ctrl+Shift+P toggles it.
MM-native devtools
Section titled “MM-native devtools”Layered on top of the preview are devtools built into Monday Morning rather than borrowed from a detached browser:
| Tool | What it shows |
|---|---|
| Console | Page console output and dev-server logs, with filter/search |
| Network | Captured page network requests, with timing and payloads |
| Errors | A build/runtime error overlay with stack traces |
| Device frames | Viewport resizing and device frames over the surface |
Auto-detection & targets
Section titled “Auto-detection & targets”When you open a project, Live Preview inspects it (package.json scripts, framework configs, and similar) and seeds preview targets — the previewable things in your project. You can also add your own, including plain URL targets.
Targets live in your project’s .mm/config.json under preview.targets. Each target carries fields such as command, cwd, label, and preferredPort. There are two kinds:
- Build / Run — a command-based target (for example
npm run dev) that Monday Morning spawns and tracks - Website / URL — a URL-only target that Monday Morning loads and probes, without spawning a process
Auto-detection is controlled by preview.autoDetect in the same config.
Multiple previews at once
Section titled “Multiple previews at once”You can run several previews concurrently. A tab strip lets you switch between targets, and each target gets its own process and its own port. Switching tabs keeps inactive previews alive rather than tearing them down, so going back to one doesn’t restart it.
Fix with Claude
Section titled “Fix with Claude”When the error overlay catches a failure, it shows a “Fix with Claude” button. Pressing it dispatches a Conductor session in the project with a prompt assembled from the error, its stack trace, the recent console output, and the preview URL — so Claude starts with the full picture instead of a bare error message.
There’s also an opt-in auto-fix mode: instead of waiting for you to press the button, Monday Morning dispatches a session automatically the first time it sees a given error signature.
AI vision (Playwright)
Section titled “AI vision (Playwright)”By default a dispatched Claude session knows about an error but can’t see the running page. The AI vision toggle changes that. When enabled, Monday Morning wires the Playwright MCP into your project’s .mcp.json (via preview_set_vision), so the dispatched session can open and inspect the preview URL itself — giving Claude real eyes on the page rather than a description of it.
Playwright here is an integration Monday Morning sets up, not a tool MM builds. It runs headless by default, so inspection happens without a visible browser window popping up.
To make sure the session navigates to the right place, the mm_preview_status MCP tool reports the project’s currently-running previews and their live URLs. A session calls it to get the exact URL — for example to point Playwright at the running site — instead of guessing a port. It returns an empty list when nothing is running.
Related
Section titled “Related”mm_preview_status— query the running previews and their URLs from a Claude session