Bordures & Ombres

Les bordures et les ombres ne sont pas un détail décoratif : elles structurent la perception de profondeur, séparent les zones cliquables des zones d'information et donnent leur identité aux composants d'un design system. Quand un border-radius passe de 12px à 0 sur l'ensemble des cartes d'un site, c'est toute l'identité visuelle qui bascule d'un univers « moderne et chaleureux » à un rendu « rigide » sans qu'aucun test fonctionnel ne signale quoi que ce soit. Sur les interfaces métier, une ombre portée supprimée sur un bouton d'action principal le rend visuellement plat et moins repérable, ce qui se traduit par des erreurs d'utilisation. Les régressions de cette catégorie naissent souvent d'un reset CSS introduit pour résoudre un cas isolé, d'un nettoyage de feuille de style qui supprime un box-shadow jugé inutile, d'un changement d'ordre de chargement entre staging et production qui modifie la cascade, ou d'une bordure ajoutée sans gestion de border-collapse sur un tableau, ce qui crée des doubles bordures irrégulières. Les outline et les séparateurs d'accessibilité sont aussi touchés par les refontes globales, avec des conséquences directes sur le focus visible. Delta-QA traite cette catégorie en comparant les captures d'écran de référence à chaque nouvelle version : l'analyse pixel détecte les changements de rayon, l'apparition ou la disparition d'une ombre, les variations d'épaisseur de trait et les modifications de couleur de bordure. Le diff visuel localise chaque carte, chaque bouton et chaque séparateur dont l'apparence a évolué, ce qui permet de valider une refonte de tokens d'élévation ou de rayon sans devoir comparer manuellement les composants un à un.