Tablas y datos de compatibilidad de navegadores (BCD)
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since marzo de 2019.
MDN tiene un formato estándar para las tablas que ilustran la compatibilidad de tecnologías web compartidas en todos los navegadores: DOM, HTML, CSS, JavaScript, SVG, etc.
Para que estos datos estén disponibles en múltiples proyectos de forma programática, se crea un paquete de Node.js a partir del repositorio browser-compat-data y se publica en npm.
Para modificar los datos dentro de estas tablas, puedes encontrar documentación completa junto con los detalles más recientes de las convenciones y esquemas JSON utilizados para representar los datos en la guía de contribución del repositorio, así como en la guía de pautas de datos. Si tienes dudas o encuentras algún problema, puedes pedir ayuda.
Uso de datos de BCD en las páginas de MDN
Una vez que los datos se hayan incluido en el repositorio browser-compat-data, puedes comenzar a incluir dinámicamente las tablas de compatibilidad y especificaciones de navegadores basadas en esos datos dentro de las páginas de MDN.
Para comenzar a usar datos de BCD en las páginas de MDN, utiliza la cadena de consulta especificada en el archivo fuente de BCD para los datos relevantes que deseas incluir. Por ejemplo:
- Los datos de compatibilidad de
AbortControllerestán definidos en api/AbortController.json y la consulta esapi.AbortController. - Los datos de compatibilidad de la cabecera HTTP
Content-Typeestán definidos en http/headers/content-type.json y la consulta eshttp.headers.Content-Type. - Los datos de compatibilidad de la propiedad
VRDisplay.capabilitiesestán definidos en api/VRDisplay.json y la consulta esapi.VRDisplay.capabilities.
La consulta de datos de compatibilidad debe especificarse en el front-matter de la página, en la clave browser-compat.
Por ejemplo, AbortController se añadiría como se muestra a continuación:
---
title: AbortController
slug: Web/API/AbortController
page-type: web-api-interface
browser-compat: api.AbortController
---
Las tablas de compatibilidad y especificaciones correspondientes a la clave se renderizan automáticamente en lugar de las macros {{Compat}} y {{Specifications}} en el código fuente.
Si se requieren múltiples tablas de compatibilidad o especificaciones en la misma página, puedes especificar el valor de browser-compat como un arreglo. Por ejemplo, para la Channel Messaging API se añadiría así:
---
title: Channel Messaging API
slug: Web/API/Channel_Messaging_API
page-type: web-api-overview
browser-compat:
- api.MessageChannel
- api.MessagePort
---
Las llamadas a las macros generan las siguientes tablas (y el conjunto correspondiente de notas):
Ejemplo de tabla de compatibilidad
Ejemplos de tablas de especificaciones
| Specification |
|---|
| DOM # interface-abortcontroller |