Devloop
Browser control + dev-server logs on one correlated timeline — so a browser console error and the backend stack trace from the same moment sit side by side. For AI agents and humans.
Watch it work
Screenshots
Use it with Claude (MCP)
claude mcp add devloop --scope user -- npx -y devloop-mcpThen, in any project: “dev_start and repro a navigate to /projects.” It starts your dev server, drives the browser, and returns a correlated slice of both sides. Need one instance shared across agents? devloop-mcp daemon. MCP blocked by an enterprise sandbox? Drive the tools as shell commands — see the mcporter guide.
Or run the cockpit
A desktop app: tabbed browser panes (and Expo iOS/Android targets) beside a unified, filterable timeline, a repro builder, an element picker, and pop-out browser windows. Grab your platform:
What it does
One timeline
Server stdout/stderr and browser console/network/page-errors share one clock — correlate cause and effect across the stack.
Web and native
Drive a browser, or an Expo/React Native app on the iOS simulator or an Android emulator — live device in the pane, native logs + RN network on the same timeline, snapshot/tap via idb/adb.
repro
Run an action sequence (navigate / click / type / eval), wait for network idle, and get everything that happened on both sides.
Per-app scoping
Run several projects at once; query logs by app name, not just the active pane. Each project gets isolated browser storage.
Shared daemon
Run one devloop-mcp daemon and many agents/sessions share it over HTTP/SSE — one browser, one dev server, one timeline.
Agent-drivable
Headless stdio for Claude Code, MCP-over-HTTP for the cockpit + daemon, or call the tools as plain shell commands via mcporter when MCP is sandboxed.
Architecture
Three transports expose one shared, transport- & substrate-agnostic core, which drives a browser — or a native device. Everything lands on one timeline.
%%{init: {"flowchart": {"wrappingWidth": 700}}}%%
flowchart TD
clients["<b>MCP clients</b><br/>Claude Code · agents · mcporter"]
clients --> stdio & daemon & cockpit
stdio["<b>stdio</b><br/><i>spawned per session</i>"]
daemon["<b>daemon</b><br/><i>HTTP/SSE · one shared instance</i>"]
cockpit["<b>cockpit</b><br/><i>HTTP/SSE · Electron app</i>"]
stdio --> mcp
daemon --> mcp
cockpit --> mcp
mcp(["<b>MCP Server</b><br/><i>stdio transport, or HTTP/SSE for the daemon + cockpit</i>"])
mcp --> core
core["<b>shared core</b> · <i>transport- and substrate-agnostic</i><br/>the MCP tool layer + one unified, correlated timeline"]
core --> iface(["<b>IBrowserController · IBrowserManager · ITargetController</b><br/><i>capability-gated by the active target</i>"])
iface --> pup & elec & rn
pup["<b>web</b> · Puppeteer / Chrome<br/><i>stdio + daemon</i>"]
elec["<b>web</b> · Electron CDP panes<br/><i>cockpit · per-project partitions</i>"]
rn["<b>native</b> · React Native (Hermes)<br/><i>JS + network over Metro CDP</i>"]
rn -->|"idb / adb"| nd["<b>NativeDriver</b><br/>iOS idb · Android adb<br/>taps · snapshot · screens · logs"]
FAQ
How do I see browser console errors and backend logs together?
Devloop timestamps your dev server's stdout/stderr and the browser's console, network, and page errors into one buffer, so a console error and the backend stack trace from the same moment line up on a single correlated timeline.
Does it work with Claude Code and MCP?
Yes. Devloop is an MCP server. Add it with claude mcp add devloop --scope user -- npx -y devloop-mcp and Claude Code can drive your browser and dev server and read both sides of the timeline.
Can it drive a native iOS or Android app?
Yes — it controls an Expo / React Native app on the iOS simulator or an Android emulator, with native logs and RN network on the same timeline and snapshot/tap via idb/adb.
How is this different from Puppeteer or browser devtools?
Those show only the browser side. Devloop correlates the browser with your dev-server logs (and native logs) on one clock, and exposes it to AI agents over MCP — so you debug cause and effect across the whole stack, not just the front end.
What if MCP is blocked by an enterprise sandbox?
Drive the same tools as plain shell commands via mcporter — see the mcporter guide.
Can multiple agents share one instance?
Run devloop-mcp daemon and many agents or sessions share it over HTTP/SSE — one browser, one dev server, one timeline.