Web Compat MCP server

MCP server providing browser compatibility data for the entire Web Platform.

Answers the question: "Does this actually work in browsers?"

Uses MDN Browser Compat Data (BCD) (15,000+ features) and W3C WebDX web-features (1,000+ features with Baseline status) to provide real-world browser implementation status.

Fully offline — all data is bundled via npm packages. No API calls, zero latency.

🇯🇵 日本語版 README はこちら

Architecture

┌─────────────────────────────────────────────┐
│           web-compat-mcp server             │
│                                             │
│  ┌───────────────┐  ┌───────────────────┐   │
│  │ @mdn/browser- │  │   web-features    │   │
│  │  compat-data  │  │  (W3C WebDX CG)   │   │
│  │  15K+ features│  │  1K+ features     │   │
│  │  BCD JSON     │  │  Baseline status  │   │
│  └───────┬───────┘  └────────┬──────────┘   │
│          │   cross-reference │              │
│          └────────┬──────────┘              │
│                   │                         │
│          ┌────────▼────────┐                │
│          │   7 MCP Tools   │                │
│          └────────┬────────┘                │
│                   │ stdio                   │
└───────────────────┼─────────────────────────┘
                    │
            MCP Client (Claude, etc.)

Related MCP server: w3c-mcp

Tools

Identifier conventions

The two data sources use different identifier schemes, and each tool expects a specific one:

BCD is fine-grained (api.PushManager, api.PushEvent, api.PushSubscription are separate entries) while web-features groups related specs into a single feature (push covers all three). When unsure of the exact identifier, run compat_search first. Input normalization handles kebab-case queries (view-transition → viewtransition) and trailing .0 versions (17.0 → 17) automatically.

Quick Start

npx (no install)

npx @shuji-bonji/web-compat-mcp

npm (global)

npm install -g @shuji-bonji/web-compat-mcp
web-compat-mcp

MCP Client Configuration

Claude Desktop

Add to claude_desktop_config.json:

{
	"mcpServers": {
		"web-compat": {
			"command": "npx",
			"args": ["-y", "@shuji-bonji/web-compat-mcp"]
		}
	}
}

Claude Code

claude mcp add web-compat -- npx -y @shuji-bonji/web-compat-mcp

VS Code (Copilot / Continue)

Add to .vscode/mcp.json:

{
	"servers": {
		"web-compat": {
			"command": "npx",
			"args": ["-y", "@shuji-bonji/web-compat-mcp"]
		}
	}
}

Usage Examples

Check browser compatibility

"Is Push API supported in Safari?"

→ compat_check feature: "api.PushManager"

Returns version support across browsers, Baseline status, and links to MDN/spec documentation.

Search features

"Find CSS grid features"

→ compat_search query: "grid" category: "css"

Returns matching feature IDs with standard/experimental/deprecated flags.

Compare features

"Compare fetch vs XMLHttpRequest"

→ compat_compare features: ["api.fetch", "api.XMLHttpRequest"]

Returns side-by-side comparison table with version support and Baseline status.

Check Baseline status

"Is container queries Baseline?"

→ compat_get_baseline feature: "container-queries"

Returns Baseline level (Widely Available / Newly Available / Not Baseline), browser support, and related BCD features.

Find features by browser version

"What CSS features were added in Chrome 120?"

→ compat_check_support browser: "chrome" version: "120" category: "css"

Returns features added in the specified browser version.

Workflow: combining multiple tools

"I want to use Push API in my PWA — is it realistic today?"

Step 1 → compat_check        feature: "api.PushManager"
         # Per-API browser versions (Chrome 42+, Safari 16+, Firefox 44+)

Step 2 → compat_get_baseline  feature: "push"
         # Feature-group view: Newly Available since 2023-03-27

Step 3 → compat_compare       features: ["api.PushManager", "api.Notification"]
         # Side-by-side when your PWA depends on both

Chained with a spec-oriented server such as W3C MCP or RFCXML MCP, the LLM can answer both "what does the spec require?" and "what actually works in browsers today?" in a single conversation.

Output Formats

All tools support response_format parameter:

• "markdown" (default) — Human-readable tables and formatted text

• "json" — Structured data with structuredContent for programmatic use

Complementary MCP Servers

This server is designed to work alongside other MCP servers:

Data Sources

Development

# Install dependencies
npm install

# Build
npm run build

# Run tests
npm test              # Unit tests (66 tests)
npm run test:e2e      # E2E tests via JSON-RPC (10 tests)

# Lint & format (Biome 2.x)
npm run lint          # Check
npm run lint:fix      # Auto-fix
npm run format        # Format

# Type check
npm run typecheck

License

MIT — see LICENSE