Servidor MCP W3C

README en japonés

Servidor MCP para acceder a especificaciones web de W3C/WHATWG/IETF. Proporciona a los asistentes de IA acceso a datos oficiales de estándares web, incluyendo especificaciones, definiciones WebIDL, propiedades CSS y elementos HTML.

Instalación

npm install -g @shuji-bonji/w3c-mcp

O utilízalo directamente con npx:

npx @shuji-bonji/w3c-mcp

Configuración

Claude Desktop

Añádelo a tu archivo de configuración de Claude Desktop:

macOS: ~/Library/Application Support/Claude/claude_desktop_config.json Windows: %APPDATA%\Claude\claude_desktop_config.json Linux: ~/.config/Claude/claude_desktop_config.json

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

Claude Code

Añade el servidor usando la CLI claude mcp:

claude mcp add w3c -- npx -y @shuji-bonji/w3c-mcp

O edita manualmente ~/.claude.json / .mcp.json a nivel de proyecto con el mismo bloque mcpServers mostrado arriba.

Cursor

Añádelo a tus ajustes de MCP de Cursor (.cursor/mcp.json en tu proyecto o en los ajustes globales):

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

Herramientas disponibles

Descubrimiento de especificaciones

list_w3c_specs

Enumera las especificaciones web de W3C/WHATWG/IETF con filtrado opcional.

Parámetros:

• organization (opcional): Filtrar por organización - "W3C", "WHATWG", "IETF" o "all"

• keyword (opcional): Filtrar por palabra clave en el título o nombre corto

• category (opcional): Filtrar por categoría

• limit (opcional): Número máximo de resultados (predeterminado: 50)

get_w3c_spec

Obtén información detallada sobre una especificación web específica.

Parámetros:

• shortname (obligatorio): Nombre corto de la especificación (ej., "service-workers", "appmanifest", "fetch")

search_w3c_specs

Busca especificaciones web mediante una cadena de consulta.

Parámetros:

• query (obligatorio): Consulta de búsqueda (ej., "service worker", "manifest", "storage")

• limit (opcional): Número máximo de resultados (predeterminado: 20)

WebIDL

get_webidl

Obtén definiciones de interfaz WebIDL para una especificación. WebIDL define las API de JavaScript.

Parámetros:

• shortname (obligatorio): Nombre corto de la especificación (ej., "service-workers", "fetch", "dom")

list_webidl_specs

Enumera todas las especificaciones que tienen definiciones WebIDL disponibles.

CSS

get_css_properties

Obtén definiciones de propiedades CSS de una especificación específica o de todas.

Parámetros:

• spec (opcional): Nombre corto de la especificación (ej., "css-grid-1", "css-flexbox-1")

• property (opcional): Buscar una propiedad CSS específica por nombre

list_css_specs

Enumera todas las especificaciones CSS que tienen definiciones de propiedades disponibles.

Elementos HTML

get_html_elements

Obtén definiciones de elementos HTML de una especificación específica o de todas.

Parámetros:

• spec (opcional): Nombre corto de la especificación (ej., "html", "svg")

• element (opcional): Buscar un elemento específico por nombre (ej., "video", "canvas")

list_element_specs

Enumera todas las especificaciones que tienen definiciones de elementos HTML disponibles.

PWA

get_pwa_specs

Obtén todas las especificaciones relacionadas con Progressive Web Apps (PWA).

Parámetros:

• coreOnly (opcional): Si es verdadero, devuelve solo las especificaciones principales de PWA (Service Worker, Manifest, Push, Notifications)

get_spec_dependencies

Obtén información básica para una especificación.

Nota: Los datos de dependencia (dependencies / dependents) aún no están expuestos por el paquete ascendente web-specs, por lo que estos campos actualmente devuelven matrices vacías. Solo los metadatos base de la especificación son fiables por ahora.

Parámetros:

• shortname (obligatorio): Nombre corto de la especificación

Ejemplos de uso

Encontrar API de Service Worker

Use the get_webidl tool with shortname "service-workers" to see the ServiceWorker interface definitions.

Explorar tecnologías PWA

Use get_pwa_specs to see all PWA-related specifications, then use get_w3c_spec for details on each one.

Buscar propiedades de CSS Grid

Use get_css_properties with spec "css-grid-1" to see all CSS Grid layout properties.

Buscar API de almacenamiento

Use search_w3c_specs with query "storage" to find all storage-related specifications.

Fuentes de datos

Este servidor MCP utiliza los siguientes paquetes de datos de W3C/webref:

Estos paquetes son mantenidos por el W3C y proporcionan datos legibles por máquina extraídos de especificaciones oficiales.

Repositorios de GitHub:

• https://github.com/w3c/browser-specs

• https://github.com/w3c/webref

Modo de depuración

Habilita el registro de depuración con variables de entorno:

# Enable debug logging
W3C_MCP_DEBUG=true npx @shuji-bonji/w3c-mcp

# Enable performance logging only
W3C_MCP_PERF=true npx @shuji-bonji/w3c-mcp

La salida de depuración incluye:

• Argumentos de llamada a herramientas

• Tiempos de ejecución

• Rendimiento de carga de datos

Arquitectura

src/
├── index.ts           # MCP server entry point
├── constants/
│   └── index.ts       # Centralized configuration constants
├── data/
│   └── loader.ts      # Data loading with caching
├── tools/             # Tool implementations
│   ├── list-specs.ts
│   ├── get-spec.ts
│   ├── search-specs.ts
│   ├── get-webidl.ts
│   ├── get-css.ts
│   ├── get-elements.ts
│   └── get-pwa-specs.ts
├── schemas/
│   └── index.ts       # Zod validation schemas
├── errors/
│   └── index.ts       # Custom error classes
├── utils/
│   ├── logger.ts      # Debug logging utilities
│   ├── mapper.ts      # Spec data mapping utilities
│   ├── search.ts      # Generic search utilities
│   └── suggestions.ts # Suggestion generation utilities
└── types/
    └── index.ts       # TypeScript type definitions

tests/
├── setup.ts           # Test setup
├── data/              # Data loader tests
├── tools/             # Tool tests
└── integration/       # MCP server integration tests

Rendimiento

• Inicio: ~70ms de precarga paralela de todos los datos

• Búsqueda de especificaciones: O(1) usando un índice basado en Map

• Búsqueda: Optimizado con terminación temprana en coincidencias exactas

Desarrollo

# Clone the repository
git clone https://github.com/shuji-bonji/w3c-mcp.git
cd w3c-mcp

# Install dependencies
npm install

# Build
npm run build

# Run in development mode
npm run dev

# Run with debug logging
W3C_MCP_DEBUG=true npm start

# Run tests
npm test

# Run tests with coverage
npm run test:coverage

# Lint code
npm run lint

# Format code
npm run format

# Lint + format (auto-fix)
npm run check

Licencia

MIT