Next.js DevTools

next-devtools-mcp is a Model Context Protocol (MCP) server that provides Next.js development tools and utilities for AI coding assistants.

50K+

5 Tools

Packaged by

Add to Docker Desktop

Version 4.43 or later needs to be installed to add the server automatically

Overview Tools (5)

Docker Hub⁠Github repository⁠

Tools

Name Description

browser_eval Automate and test web applications using Playwright browser automation. This tool connects to playwright-mcp server and provides access to all Playwright capabilities. CRITICAL FOR PAGE VERIFICATION: When verifying pages in Next.js projects (especially during upgrades or testing), you MUST use browser automation to load pages in a real browser instead of curl or simple HTTP requests. This is because: - Browser automation actually renders the page and executes JavaScript (curl only fetches HTML) - Detects runtime errors, hydration issues, and client-side problems that curl cannot catch - Verifies the full user experience, not just HTTP status codes - Captures browser console errors and warnings via console_messages action IMPORTANT FOR NEXT.JS PROJECTS: If working with a Next.js application, PRIORITIZE using the 'nextjs_runtime' tool instead of browser console log forwarding. Next.js has built-in MCP integration that provides superior error reporting, build diagnostics, and runtime information directly from the Next.js dev server. Only use browser_eval's console_messages action as a fallback when nextjs_runtime tools are not available or when you specifically need to test client-side browser behavior that Next.js runtime cannot capture. Available actions: - start: Start browser automation (automatically installs if needed). Verbose logging is always enabled. - navigate: Navigate to a URL - click: Click on an element - type: Type text into an element - fill_form: Fill multiple form fields at once - evaluate: Execute JavaScript in browser context - screenshot: Take a screenshot of the page - console_messages: Get browser console messages (for Next.js, prefer nextjs_runtime tool instead) - close: Close the browser - drag: Perform drag and drop - upload_file: Upload files - list_tools: List all available browser automation tools from the server Note: The playwright-mcp server will be automatically installed if not present.

Name	Description
`browser_eval`	Automate and test web applications using Playwright browser automation. This tool connects to playwright-mcp server and provides access to all Playwright capabilities. CRITICAL FOR PAGE VERIFICATION: When verifying pages in Next.js projects (especially during upgrades or testing), you MUST use browser automation to load pages in a real browser instead of curl or simple HTTP requests. This is because: - Browser automation actually renders the page and executes JavaScript (curl only fetches HTML) - Detects runtime errors, hydration issues, and client-side problems that curl cannot catch - Verifies the full user experience, not just HTTP status codes - Captures browser console errors and warnings via console_messages action IMPORTANT FOR NEXT.JS PROJECTS: If working with a Next.js application, PRIORITIZE using the 'nextjs_runtime' tool instead of browser console log forwarding. Next.js has built-in MCP integration that provides superior error reporting, build diagnostics, and runtime information directly from the Next.js dev server. Only use browser_eval's console_messages action as a fallback when nextjs_runtime tools are not available or when you specifically need to test client-side browser behavior that Next.js runtime cannot capture. Available actions: - start: Start browser automation (automatically installs if needed). Verbose logging is always enabled. - navigate: Navigate to a URL - click: Click on an element - type: Type text into an element - fill_form: Fill multiple form fields at once - evaluate: Execute JavaScript in browser context - screenshot: Take a screenshot of the page - console_messages: Get browser console messages (for Next.js, prefer nextjs_runtime tool instead) - close: Close the browser - drag: Perform drag and drop - upload_file: Upload files - list_tools: List all available browser automation tools from the server Note: The playwright-mcp server will be automatically installed if not present.