Assurance qualité
Review de code (PR)
Comment relire une grosse PR ?
- Tester en local sur example
- Vérifier les breakpoints
- Vérifier les états (full-width / ou pas full-width)
Percy
Percy est un outil de suivi créant des snapshots permettant des analyses visuelles.
Sur Percy
- Cliquer sur « Create new project ».
- Nommer le projet.
- Dans les paramètres du projet (« Project settings »), changer
default base branch
etauto-approve branches
par la branche modèle du site (main
oumaster
en général). - Toujours dans les paramètres, récupérer le « project token ».
Dans le github du site
Ajouter le token percy dans les secrets du repo (cf. documentation de Percy) (Settings > Action secrets > « New secret ») sous le nom PERCY_TOKEN
.
Dans le projet
- Dans
.github/workflows/
ajouter un fichierpercy.yml
basé sur ce modèle : template. - À la racine du projet, ajouter un fichier
percy.yml
basé sur ce modèle : template - À la racide du projet, configurez un
snapshots.yml
qui indexe toutes les pages que Percy examinera, de cette façon :
snapshots.yml
serve: ./public
snapshots:
- name: Home
url: index.html
- name: Titre d'une page
url: ...
ℹ️
- Chaque URL doit être précédée d’un
/
et suivie d’un/index.html
- Dans le cadre d’un site multilingue, bien ajouter
/fr/
avant l’URL.
Utiliser Percy
Dans un premier temps, Percy va examiner les pages de la branche modèle. Pour qu’il compare cette branche avec une autre, il faut créer une pull request (pas en draft), le build de la comparaison se fera automatiquement à chaque push sur la branche.