Vercel Labs Releases 'next-browser' for DevTool Automation
Vercel Labs has launched `next-browser`, an open-source toolkit that gives programmatic access to the React DevTools and Next.js dev server. The tool allows developers to write scripts that interact with component trees, props, and state. This opens up new possibilities for automated testing, debugging, and AI-driven UI analysis within the Next.js ecosystem.
The `next-browser` toolkit is specifically engineered for AI agents, translating GUI-based DevTool interactions into command-line operations. An LLM, which cannot interpret a visual DevTools panel, can execute a command like `next-browser tree` to parse a component tree and determine its next action. This approach contrasts with general-purpose automation tools like Playwright and Puppeteer, which are designed for end-to-end testing and web scraping. While `next-browser` uses Playwright as a dependency, its focus is on providing a stateful, persistent daemon for rapid, iterative commands suitable for an agent's thought process. The command-line interface exposes the internals of a Next.js application. Developers can programmatically access not just the component tree, but also props, hooks, state, and even build errors or Suspense boundaries, all through structured text output. This design enables a new workflow for AI-driven development and debugging. An agent can navigate a page with `push`, inspect a component's state with `tree <id>`, and then restart the dev server with `restart-server` to clear caches, all within a scriptable loop. Recent updates have expanded its capabilities, adding features like annotated screenshots that overlay interactive elements with labels for multimodal AI models. Other additions include profiler commands for Chrome DevTools, browser extension loading, and improved visual comparison tools. Ultimately, `next-browser` is part of a larger Vercel strategy around AI, complementing offerings like the Vercel AI SDK and Vercel Agent. It provides the foundational layer for AI to not just generate code, but to actively interact with, debug, and understand the front-end it's building in real-time.
