Tableaux de compatibilité des navigateurs et données de compatibilité des navigateurs (BCD)
Baseline
Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis mars 2019.
MDN utilise un format standard pour les tableaux qui illustrent la compatibilité des technologies partagées entre tous les navigateurs, comme DOM, HTML, CSS, JavaScript, SVG, etc. Pour rendre ces données disponibles dans plusieurs projets de façon programmatique, un package Node.js est construit à partir du dépôt browser-compat-data (angl.) et publié sur npm.
Pour modifier les données de ces tableaux, la documentation complète ainsi que les détails les plus récents sur les conventions et les schémas JSON utilisés pour représenter les données se trouvent dans le guide de contribution du dépôt (angl.) ainsi que dans le guide des règles de données (angl.). Si vous avez des questions ou rencontrez des problèmes, vous pouvez demander de l'aide.
Utiliser les données BCD dans les pages MDN
Une fois les données incluses dans le dépôt browser-compat-data (angl.), vous pouvez commencer à inclure dynamiquement des tableaux de compatibilité des navigateurs et des tableaux de spécifications basés sur ces données dans les pages MDN.
Pour commencer à utiliser les données BCD dans les pages MDN, utilisez la chaîne de requête spécifiée dans le fichier source BCD pour les données que vous souhaitez inclure. Par exemple :
- Les données de compatibilité de
AbortControllersont définies dans api/AbortController.json (angl.) et peuvent être interrogées avecapi.AbortController. - Les données de compatibilité de l'en-tête HTTP
Content-Typesont définies dans http/headers/content-type.json (angl.) et la requête esthttp.headers.Content-Type. - Les données de compatibilité de la propriété
VRDisplay.capabilitiessont définies dans api/VRDisplay.json (angl.) et la requête estapi.VRDisplay.capabilities.
La requête de compatibilité doit être spécifiée dans le front-matter de la page sous la clé browser-compat.
Par exemple, AbortController serait ajoutée comme ci-dessous :
Attention : Cela ne concerne que les pages anglaises.
---
title: AbortController
slug: Web/API/AbortController
page-type: web-api-interface
browser-compat: api.AbortController
---
Les tableaux de compatibilité et de spécifications correspondant à la clé sont alors automatiquement affichés à la place des macros {{Compat}} et {{Specifications}} dans la source.
Si plusieurs tableaux de compatibilité ou de spécifications sont nécessaires sur la même page, vous pouvez spécifier la valeur de browser-compat comme un tableau. Par exemple, pour la Channel Messaging API, cela serait ajouté comme ci-dessous :
Attention : Cela ne concerne que les pages anglaises.
---
title: Channel Messaging API
slug: Web/API/Channel_Messaging_API
page-type: web-api-overview
browser-compat:
- api.MessageChannel
- api.MessagePort
---
Les appels de macro génèrent les tableaux suivants (et l'ensemble des notes associées) :
Exemple de tableau de compatibilité
Chargement…
Exemples de tableaux de spécifications
| Specification |
|---|
| DOM # interface-abortcontroller |