Le catalogue en panne — exercice corrigé de Vue : construire une application web (école d'ingénieur) (chapitre 10)

Le catalogue en panne

Pinia : un état partagé par toute l'application · niveau 2

Énoncé

Avec le store du catalogue de la Librairie, que se passe-t-il si le premier appel de charger() reçoit une erreur 500 ? Un deuxième appel relance-t-il la requête ? Et un troisième, après un succès ? Répondre en lisant le code, puis le vérifier avec un test qui remplace fetch.

Corrigé

En lisant charger : après l'erreur, erreur contient le message et dejaCharge est resté false ; un deuxième appel relance donc la requête. Après un succès, dejaCharge vaut true et un appel sans forcer ne fait rien. Le test remplace fetch par une fonction qui répond d'abord 500, puis 200 :


const reponses = [
  { ok: false, status: 500, json: async () => ({}) },
  { ok: true, status: 200, json: async () => [{ isbn: "1", titre: "Java" }] },
];
const faux = vi.fn(async () => reponses.shift());
vi.stubGlobal("fetch", faux); // remplace fetch le temps du test


1er charger()          → 0 livre(s), erreur : Le serveur a répondu 500., requêtes : 1
2e charger()           → 1 livre(s), erreur : null, requêtes : 2
3e charger()           → 1 livre(s), erreur : null, requêtes : 2