MCP Vitest runner with LLM-optimized test output, log capturing, and line-by-line coverage analysis.
- ๐ข The Problem with LLMs and Testing
- โจ Key Features
- ๐ Quick Start
- ๐ Requirements
- ๐งฐ Tools
- ๐ Multi-Repository Support
- ๐ช Claude Code Hook
- ๐ค LLM instructions
- โ๏ธ Configuration
- ๐ Development Mode & Debugging
- ๐ง Troubleshooting
- ๐ License
- Noisy test output - Raw Vitest output can be extremely verbose eating up tokens/context with useless information.
- Full test suite runs - LLMs sometimes forget to limit the scope of the test run, causing full test suite runs to be executed.
- Buried console logs - Console logs can be hidden in test output, making it inefficient for LLMs to debug test failures.
- Raw coverage files - Raw coverage files are too large for AI to parse.
- Watch mode - LLMs get stuck when vitest runs in watch mode.
- Smart Test Results with adaptive, structured output to limit noise.
- Console Log Capture to prevent logs from getting lost in test output.
- Coverage Analysis with line-by-line gap insights.
- Multi-Repository Support in a single session with context switching.
- Safety Guards prevent full project runs, watch mode, invalid vitest commands, and context hogging.
The Vitest MCP server can be used with any MCP-compatible IDE or tool and works with all Javascript or Typescript Vitests. The basic configuration is:
{
"mcpServers": {
"vitest": {
"command": "npx",
"args": ["-y", "@djankies/vitest-mcp"]
}
}
}
โ ๏ธ Note: The above example may not be valid for all MCP clients. Verify your client's specific setup instructions.
Select your preferred IDE or tool from the setup guides below:
Claude Code
Claude Code supports multiple configuration approaches:
# Add server with interactive prompts
claude mcp add vitest -- npx -y @djankies/vitest-mcp
# Add to project scope (shareable with team)
claude mcp add --scope project vitest -- npx -y @djankies/vitest-mcpCreate or edit .mcp.json in your project root:
{
"mcpServers": {
"vitest": {
"type": "stdio",
"command": "npx",
"args": ["-y", "@djankies/vitest-mcp"],
"env": {}
}
}
}- Local (default): Personal, project-specific - stored in user settings
- Project: Team-shared - stored in
.mcp.jsonin project root - User: Available across all projects - global configuration
- Navigate to your project directory
- Choose either CLI or file-based configuration
- For CLI: Run
claude mcp add vitest npx -y @djankies/vitest-mcp - For file: Create
.mcp.jsonwith the configuration above - Verify with
/mcpcommand in Claude Code to see connection status
Once configured, use the MCP server naturally in your conversations:
- "Set the project root to this directory"
- "Run the auth component tests"
- "Show me the test coverage gaps"
Claude Desktop
- macOS:
~/Library/Application Support/Claude/claude_desktop_config.json - Windows:
%APPDATA%\Claude\claude_desktop_config.json
{
"mcpServers": {
"vitest": {
"command": "npx",
"args": ["-y", "@djankies/vitest-mcp"]
}
}
}- Open Claude Desktop
- Navigate to File โ Settings โ Developer
- Click Edit Config
- Add the configuration above
- Save and restart Claude Desktop
- Look for the MCP indicator (๐) in the conversation input
VS Code
- Workspace:
.vscode/mcp.jsonin your project - Global: Run command
MCP: Open User Configuration
{
"mcpServers": {
"vitest": {
"command": "npx",
"args": ["-y", "@djankies/vitest-mcp"],
"type": "stdio"
}
}
}- Install VS Code 1.86+ with GitHub Copilot
- Open Command Palette (
Cmd/Ctrl + Shift + P) - Run
MCP: Add Server - Select Workspace Settings or Global
- Add the configuration and save
- Access via Copilot Chat: Add Context โ MCP Resources
Cursor
- Project:
.cursor/mcp.jsonin your project directory - Global:
~/.cursor/mcp.jsonfor all workspaces
{
"mcpServers": {
"vitest": {
"command": "npx",
"args": ["-y", "@djankies/vitest-mcp"]
}
}
}- Create the configuration file in your preferred location
- Add the server configuration
- Restart Cursor
- The MCP server will be available in Cursor's AI chat
- Use natural language to run tests: "Run the auth component tests"
Windsurf
Similar to Cursor, but use serverUrl instead of url for remote servers
{
"mcpServers": {
"vitest": {
"command": "npx",
"args": ["-y", "@djankies/vitest-mcp"]
}
}
}- Open Windsurf Settings (
Cmd/Ctrl + ,) - Navigate to Cascade settings
- Add MCP server configuration
- Reload MCP servers to activate
Cline (VS Code Extension)
{
"mcpServers": {
"vitest": {
"command": "npx",
"args": ["-y", "@djankies/vitest-mcp"]
}
}
}- Open VS Code with Cline extension installed
- Click the Cline icon in the sidebar
- Click MCP Servers โ Configure MCP Servers
- Add the vitest-mcp configuration
- Save and reload VS Code
- Access through Cline's chat interface
Once configured, you can use natural language to interact with your tests:
- "Run the tests for this component"
- "Debug this test file"
- "Analyze the coverage for this file"
Or prepend your message with vitest-mcp: to ensure the tools are used:
- "vitest-mcp: run tests for this component"
- "vitest-mcp: debug this test file"
- "vitest-mcp: analyze coverage for this file"
- Node.js: 18+ ๐ข
- Vitest: 0.34.0+ ๐งช
- Coverage:
@vitest/coverage-v8(for coverage analysis) ๐
npm install --save-dev vitest@latest @vitest/coverage-v8@latest๐จ Required first - Set the project root for all operations.
| Parameter | Type | Required | Description |
|---|---|---|---|
path |
string | Yes | Project root path |
List test files in your project. Helps keep LLMs from slipping back to using command line tools while working with tests.
| Parameter | Type | Required | Description |
|---|---|---|---|
directory |
string | Yes | Directory to search for test files |
Execute tests with structured output.
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
target |
string | Yes | File or directory to test |
format |
string | No | Output format: "summary" or "detailed" (auto-detects based on results) |
showLogs |
boolean | No | Include console output with [stdout] or [stderr] prefixes |
project |
string | No | Vitest project name for monorepos |
Analyze test coverage with gap insights.
| Parameter | Type | Required | Description |
|---|---|---|---|
target |
string | Yes | File or directory to analyze coverage for |
format |
string | No | Output format: "summary" (overview only) or "detailed" (includes line-by-line coverage) |
exclude |
string[] | No | Patterns to exclude from coverage (e.g., ["**/.stories."]) |
Note: Coverage thresholds should be configured in your
vitest.config.tsfile, not via MCP parameters.
Automatically excludes test utilities, mocks, stories, and e2e files.
// Project A
set_project_root({ path: "/path/to/frontend" })
run_tests({ target: "./src" })
// Project B
set_project_root({ path: "/path/to/backend" })
run_tests({ target: "./src" })Automatically redirect Vitest commands to MCP tools:
# Run from project root
curl -o .claude/vitest-hook.sh https://raw.githubusercontent.com/djankies/vitest-mcp/refs/heads/main/.claude/vitest-hook.sh
chmod +x .claude/vitest-hook.shThen add to your project's .claude/settings.local.json:
{
"hooks": {
"PreToolUse": [{
"matcher": "Bash",
"hooks": [{ "type": "command", "command": ".claude/vitest-hook.sh" }]
}]
}
}The hook can be bypassed with the BYPASS_VITEST_HOOK environment variable:
BYPASS_VITEST_HOOK=1 npm testOr export for entire session:
export BYPASS_VITEST_HOOK=1Encourage claude or your ide to use the tools correctly: CLAUDE.example.md
The MCP server automatically detects and uses Vitest configuration files in the following priority order:
vitest.mcp.config.ts- MCP-specific configuration (highest priority) ๐vitest.config.tsvitest.config.jsvitest.config.mjsvite.config.ts(if it contains test configuration)vite.config.js(if it contains test configuration)vite.config.mjs(if it contains test configuration)
This allows you to have a dedicated MCP-specific configuration that won't interfere with your regular development workflow:
// vitest.mcp.config.ts
import { defineConfig } from 'vitest/config';
export default defineConfig({
test: {
// MCP-specific settings
reporters: ['json'],
coverage: {
enabled: true,
provider: 'v8',
reporter: ['json', 'html'],
},
},
});To enable coverage threshold reporting in the analyze_coverage tool, just configure in your Vitest configuration file:
// vitest.config.ts or vitest.mcp.config.ts
import { defineConfig } from 'vitest/config';
export default defineConfig({
test: {
coverage: {
provider: 'v8',
reporter: ['text', 'json', 'html'],
thresholds: {
lines: 90,
functions: 85,
branches: 80,
statements: 90
}
}
}
});๐ก Note: Coverage analysis is always available regardless of threshold settings. Threshold reporting just helps keep your LLM on target.
Optional .vitest-mcp.json in home or project directory:
{
"safety": {
"allowedPaths": ["/Users/username/Projects"]
},
"testDefaults": {
"format": "detailed",
"timeout": 60000
}
}Configuration is merged in the following order (highest priority first):
- Command-line flags
- Environment variables
- Configuration file
- Built-in defaults
Set the debug environment variable for detailed logging:
VITEST_MCP_DEBUG=trueOr in your MCP config file:
{
"mcpServers": {
"vitest": {
"command": "npx",
"args": ["-y", "@djankies/vitest-mcp"],
"env": {
"VITEST_MCP_DEBUG": "true"
}
}
}
}Enable to test the server on its own codebase:
# Set in .env.development, or in your mcp config file
VITEST_MCP_DEV_MODE=true"Vitest not found" - Install: npm install --save-dev vitest@latest
"Coverage provider not found" - Install: npm install --save-dev @vitest/coverage-v8@latest ๐
Hook issues - Bypass with: VITEST_HOOK_BYPASS=1 npm test
Found a bug? Submit a bug report, please, and thank you.
MIT โ See LICENSE.