tech(pdf): replace wkhtmltopdf (no longer maintained) with grover

[Holist]

#2439

wkhtmltopdf est déprécié depuis quelques années maintenant et doit être remplacé.
Les environnements virtuels Ubuntu ne le prennent plus en charge (On a du setup la CI de GH récemment pour que celle ci continue à fonctionner ici)
Il est temps de changer.

Plusieurs choix s'offrent à nous pour générer des PDFs :

Approche	Description	Exemples	Avantages	Inconvénients
Via Navigateur Headless	Utilise Chrome/Firefox en mode headless. Converti le HTML/CSS en PDF	Grover, Puppeteer	Rendu moderne et fidèle, simple d'utilisation	- Dépendance à DevTools et Chromium - Temps de démarrage du navigateur headless à chaque génération
Moteurs de rendu dédiés	Bibliothèques spécialisées PDF (Gratuit ou payant). Pas de dépendance navigateur	WeasyPrint, PrinceXML	Plus léger, meilleur support CSS print	- Installation plus complexe avec nombreuses dépendances système - Différences possibles de rendu avec les navigateurs modernes - Coût significatif pour solutions payantes
Génération programmatique	Construction du PDF via code. Pas de HTML/CSS	Prawn	Contrôle total du rendu	- Pas de réutilisation directe du HTML/CSS existant - Courbe d'apprentissage importante - Maintenance plus complexe (rendu en code) - Difficulté avec layouts complexes - Temps de développement initial plus long

Pour notre usage je pense que la gem Grover basée sur Puppeteer et Chromium répond à nos besoins qui sont assez simples (lettre standard) tout en étant facile à utiliser et à faire évoluer au besoin.

Quelques détails techniques

J'ai du mettre à jour eslint-config-airbnb pour installer Puppeteer.
On dois charger la police Marianne en base64 dans le css directement car Puppeteer et le navigateur headless n'a pas accès aux ressources et aux fichiers. (On aurait pu mettre un lien vers un cdn mais je n'ai pas trouvé la police sur un CDN).
J'ai du ajuster (ce qui m'a pris le plus de temps) le css existant, en utilisant flexbox. J'ai aussi ajouté une classe dédiée pour l'adresse de l'usager afin que celle ci (en absolute) soit bien positionnée pour les enveloppes à fenêtres. (Testé et validé par l'agent référent de l'Ardéche)
La génération de pdf fonctionne beaucoup mieux en environnement de développement (2/3 des fois ou je tentais de générer des pdf avec wickedpdf j'avais des symboles incompréhensibles dans le document).
Il y a un fix pour pouvoir utiliser les dernières versions d'Ubuntu dans la CI, il faut désactiver appArmor. Plus de détails ici : puppeteer/puppeteer#13196

Un exemple de pdf :

Invitation_1738670141_Barthelemy_Maurice.pdf

[Holist]

il s'agit de nouvelles règles introduites par la mise à jour de "eslint-config-airbnb" qui était nécessaire pour l'installation de "puppeteer". Plutôt que de fix les erreurs sur du code react qui va bientôt disparaitre j'ai ajouté ces règles en exception.

[Holist]

Bonne idée pour l'hébergement sur Scaleway de la police Michaël mais ça ne passe pas...
Je pense que la police distante n'a pas le temps de se charger avant la génération du pdf.
Pour éviter les problèmes je suggère de laisser tel quel avec la police en base64 dans le css.

[Holist]

cette méthode n'était pas utilisée

[aminedhobb]

Merci @Holist pour ce taff 🙏 🚀 !!
Trop cool d'enlever cette dépendance avec une solution qui marche comme avant 💪 !

J'ai fait quelque tests et il y a un truc que je trouve un peu gênant dans la nouvelle mise en page c'est le fait que l'adresse ne soit pas alignée avec l'en-tête comme dans l'exemple ci-dessous:

• Avant:

• Après:

Sinon à part ça il y a des petits changements au niveau de la taille des textes mais c'est ok pour moi, il faudra peut-être vérifier avec l'équipe produit que c'est bon pour eux aussi avant de déployer en prod.

[Holist]

Merci @Holist pour ce taff 🙏 🚀 !! Trop cool d'enlever cette dépendance avec une solution qui marche comme avant 💪 !

J'ai fait quelque tests et il y a un truc que je trouve un peu gênant dans la nouvelle mise en page c'est le fait que l'adresse ne soit pas alignée avec l'en-tête comme dans l'exemple ci-dessous:

• Avant:

* Après: Sinon à part ça il y a des petits changements au niveau de la taille des textes mais c'est ok pour moi, il faudra peut-être vérifier avec l'équipe produit que c'est bon pour eux aussi avant de déployer en prod.

Merci pour ta review, je me suis occupé de l'alignement. Je laisse un message pour demander le go de l'équipe et on pourra merge :)