Configure des tests Ts + WebComponents

[Floby]

fixes #23

Pour lancer des tests :

npm test

Petit apérçu du résultat :)

Très fortement inspiré par cet article https://matthias-kainer.de/blog/posts/testing-webcomponents-with-jest-and-dom-testing-tools/

Le pipeline de compilation/transformation est différent selon qu'on teste ou qu'on build mais l'intégration officielle entre jest est vite est un sujet chaud (vitejs/vite#1955).

J'ai choisi testing-library parce que de mon experience, ça permet de faire des tests suffisamment indépendants de l'implémentation pour pouvoir refacto tranquillement. Un effet de bord appréciable est que ça rend le code plus accessible car les assertions se base sur l'arbre d'accessibilité du navigateur (enfin jsdom ici).

[fcamblor]

Super propres les tests !

J'attends de merger #142 pour la merger mais c'est top !

[joffreyBerrier]

Hello @Floby dis moi, comment tu as fait pour ne pas avoir ce genre d'erreur avec jest ?

The 'import.meta' meta-property is only allowed when the '--module' option is 'es2020', 'esnext', or 'system'.

[Floby]

haha ^^
j'ai caché les import.meta dans du code qui n'est pas parsé pendant les tests :D

[Floby]

en fait import.meta pose 2 problèmes

• pour une raison que j'ignore la compilation TS pendant le run Jest ne comprends pas qu'il est bien en target es2020. Je suppute que c'est lié au runtime jest (node) qui ne supporte pas officiellement ces formats.
• même avec un // @ts-ignore bien placé, on bypass le truc, ce qui permet de récupérer les types définis dedans
• mais quand on veut utiliser des fonctions qui sont définie dans un fichier avec du import.meta alors c'est le runtime (node) qui nous dit qu'il ne supporte pas la syntaxe en dehors d'un module.

Après import.meta.env c'est du spécifique au build vitejs donc je serai pour faire en sorte que ça n'apparaisse pas dans le code en dehors du build ou de la config de prod.