Publié le 12 juin 2025
Le 20 mai 2025, la spécification HTML a été mise à jour pour échapper à < et > dans les attributs, ce qui permet d'éviter les failles de mutation XSS (mXSS). Cette modification a été apportée dans Chrome 138, qui est passé en version bêta le 28 mai 2025 et deviendra stable le 24 juin 2025.
Cet article détaille l'impact de la modification de l'échappement d'attribut HTML sur les développeurs Web et les pannes potentielles. La raison d'être de cette modification en termes de sécurité est expliquée dans notre article associé sur le blog Security Engineering.
Qu'est-ce qui a changé ?
Supposons que vous disposiez d'un élément <div> dont l'attribut data-content a une valeur de "<u>hello</u>". Que se passe-t-il lorsque vous lisez div.outerHTML ?
Auparavant, vous obteniez le code HTML suivant:
<div data-content="<u>hello</u>"></div>
Après le changement, vous obtiendrez le code HTML suivant:
<div data-content="<u>hello</u>"></div>
Auparavant, ni <, ni > n'étaient échappés dans les attributs. Désormais, ces deux caractères sont toujours échappés.
Ce qui n'a pas changé
Cette modification modifie exclusivement la façon dont les fragments HTML sont convertis en représentation de chaîne lors de la sérialisation. L'impact est limité aux scénarios où les propriétés innerHTML ou outerHTML sont accessibles, ou lorsque la méthode getHTML() est appelée sur un élément. Ces opérations prennent la structure DOM existante et génèrent une représentation HTML textuelle.
Ce changement n'a pas d'incidence sur l'analyse HTML. Prenons l'exemple HTML suivant:
<div id="div1" data-content="<u>hello</u>"></div>
<div id="div2" data-content="<u>hello</u>"></div>
Les deux div seront analysés exactement de la même manière et, dans les deux cas, div.dataset.content renverra "<u>hello</u>".
Qu'est-ce qui ne sera pas endommagé ?
Si vous utilisez une API DOM, telle que getAttribute, getAttributeNS, dataset ou attributes, pour récupérer les valeurs d'attribut, elles renverront les mêmes valeurs décodées qu'auparavant, en particulier avec < et > décodés.
Prenons l'exemple suivant, dans lequel toutes les lignes console.log journalisent "<u>":
<div data-content="<u>"></div>
const div = document.querySelector("div");
// All of the following will log "<u>"
console.log(div.getAttribute("data-content"));
console.log(div.dataset.content);
console.log(div.attributes['data-content'].value);
Que peut-il se passer ?
innerHTML et outerHTML pour obtenir des attributs
Si vous utilisez innerHTML ou outerHTML pour extraire la valeur d'un attribut, votre code risque de ne pas fonctionner. Prenons l'exemple suivant, bien que légèrement alambiqué:
<div data-content="<u>"></div>
const div = document.querySelector("div");
const content = div.outerHTML.match(/"([^"]+)"/)[1];
console.log(content);
Ce code présentera un comportement différent après cette modification. Auparavant, content était égal à "<u>", mais il est désormais "<u>".
Notez que l'analyse du code HTML à l'aide d'expressions régulières n'est pas recommandée. Si vous devez obtenir la valeur d'un attribut, utilisez les API DOM décrites dans les sections précédentes.
Tests de bout en bout
Si vous disposez d'un pipeline CI/CD dans lequel vous utilisez Chromium pour générer du code HTML et que vous avez écrit des tests pour comparer le code HTML à une valeur attendue statique, ces tests peuvent échouer si un attribut contient < ou >.
Il s'agit d'une erreur attendue. Vous devez mettre à jour la valeur attendue afin que tous les caractères < et > soient échappés en < et >,, respectivement.
Résumé
Cet article de blog décrit une modification de la spécification HTML qui entraînera l'échappement de < et > dans les attributs afin d'améliorer la sécurité en empêchant certaines instances de XSS de mutation.
Ce changement sera disponible pour tous les utilisateurs le 24 juin 2025 sur Chromium (version 138) et Firefox (version 140). Elle est également incluse dans la version bêta de Safari 26, qui devrait être publiée vers septembre 2025.
Si vous pensez que ce changement a affecté votre site Web et que vous ne disposez pas d'un moyen simple de le corriger, veuillez signaler un bug sur https://issues.chromium.org/.