Delta-QA vs Chromatic : tester des pages complètes vs tester des composants

Delta-QA vs Chromatic : tester des pages complètes vs tester des composants

Comparatif : Delta-QA ou Chromatic, tester des pages complètes ou des composants ?

Chromatic est l'outil de référence pour le test visuel de composants UI via Storybook. Delta-QA teste des pages web complètes avec de vrais parcours utilisateur. Ce ne sont pas des concurrents directs — ce sont deux niveaux de test différents. Et comprendre la différence évite de croire qu'on est protégé quand on ne l'est qu'à moitié.

Ce que teste Chromatic

Chromatic capture chaque story Storybook et la compare à sa version précédente. Un bouton dans ses 5 états (default, hover, active, disabled, loading). Une card avec titre court et titre long. Un formulaire vide et pré-rempli.

C'est puissant pour protéger une librairie de composants. Chaque modification d'un composant partagé est immédiatement détectée. L'interface de review est excellente pour la collaboration entre designers et développeurs.

Le problème, c'est que Chromatic teste des composants en isolation. Un composant seul, dans un conteneur neutre, sans contexte de page. Et c'est là que les bugs se cachent.

Ce que teste Delta-QA

Delta-QA teste des pages complètes. Pas des composants isolés — des vraies pages avec un vrai layout, un vrai contenu, de vrais composants qui interagissent entre eux.

Un composant Card parfait en Storybook peut casser quand il est dans une grille de 3 colonnes avec un sidebar. Un bouton validé isolément peut disparaître derrière un footer en contexte réel. Un formulaire irréprochable en story peut déborder de son conteneur quand il est intégré dans une modale.

Ces bugs-là, Chromatic ne les voit pas. Delta-QA les voit parce qu'il teste ce que l'utilisateur voit réellement — la page complète, dans un vrai navigateur, avec le vrai contenu.

Le prérequis Storybook

Chromatic nécessite Storybook. Si votre projet n'utilise pas Storybook, Chromatic n'a aucun sens. Et mettre en place Storybook uniquement pour le test visuel, c'est un investissement considérable : écrire des stories pour chaque composant, maintenir ces stories à jour, gérer les données de démo.

Delta-QA ne nécessite rien. Pas de Storybook, pas de framework spécifique, pas de code. Vous avez un site web ? Vous pouvez le tester.

Cloud vs local

Chromatic est exclusivement cloud. Vos captures sont envoyées et stockées sur l'infrastructure Chromatic. Pas d'option self-hosted, même avec un GitLab self-managed.

Delta-QA est local par défaut. Tout reste sur votre machine. Pas de données qui sortent.

Le pricing

Chromatic offre 5 000 snapshots gratuits par mois, mais uniquement sur Chrome. Le multi-navigateur démarre à 179$/mois. Et les snapshots se comptent vite : 180 stories × 3 viewports = 540 snapshots par build, soit ~9 builds avant d'atteindre la limite gratuite.

Delta-QA Desktop est gratuit sans limite. Multi-navigateur inclus.

La vraie question

La question n'est pas "Chromatic ou Delta-QA ?". C'est "testez-vous vos composants, vos pages, ou les deux ?"

Si vous avez Storybook et un design system, Chromatic protège votre librairie de composants. C'est un premier filet de sécurité.

Mais il vous faut aussi un deuxième filet pour les pages complètes. C'est là que Delta-QA intervient. Les deux outils se complètent — l'un ne remplace pas l'autre.

Et si vous n'utilisez pas Storybook, Delta-QA est la seule option nécessaire.

FAQ

Chromatic fonctionne-t-il sans Storybook ?

Chromatic s'ouvre à Playwright et Cypress depuis 2025, mais ces intégrations sont encore jeunes. Historiquement et en pratique, Storybook reste le prérequis principal.

Un composant parfait en Storybook peut-il casser en page ?

Oui. L'isolation de Storybook masque les interactions avec le layout parent, les composants voisins, le contenu réel et les contraintes de l'écran. C'est le piège principal du test de composants isolés.

Peut-on utiliser Chromatic et Delta-QA ensemble ?

Oui, et c'est l'approche recommandée. Chromatic pour les composants, Delta-QA pour les pages. Chaque outil couvre un niveau différent.

Lequel est le plus rapide à mettre en place ?

Delta-QA : quelques minutes. Chromatic : plusieurs heures à quelques jours (setup Storybook + écriture des stories + configuration CI).


Chromatic teste des composants UI isolés via Storybook. Delta-QA teste des pages web complètes et des parcours utilisateur réels — sans Storybook, sans code, sans compétence technique.


Essayer Delta-QA Gratuitement →


Article précédent : Delta-QA vs Percy