déplace estDemarre et estTermine de la vue accueil vers le store

Co-authored-by: Guillaume Imary <guillaume.imary@captive.fr>

src/situations/accueil/modeles/store.js

@@ -22,6 +22,18 @@ export function creeStore (registreUtilisateur, registreCampagne) {
       situationsFaites: registreUtilisateur.situationsFaites(),
       etat: registreUtilisateur.estConnecte() ? DEMARRE : DECONNECTE
     },
+
+    getters: {
+      estDemarre (state) {
+        return state.etat === DEMARRE;
+      },
+
+      estTermine (state) {
+        return state.situations.length > 0 &&
+          state.situationsFaites.length >= state.situations.length;
+      }
+    },
+
     mutations: {
       connecte (state, nom) {
         state.estConnecte = true;

src/situations/accueil/vues/accueil.vue

@@ -86,7 +86,7 @@
 </template>
 
 <script>
-import { mapState, mapActions } from 'vuex';
+import { mapState, mapGetters, mapActions } from 'vuex';
 import 'accueil/styles/accueil.scss';
 import 'commun/styles/cadre.scss';
 import 'commun/styles/actions.scss';
@@ -101,7 +101,6 @@ import Fin from 'accueil/vues/fin';
 import IntroConsigne from 'commun/vues/intro_consigne';
 import TransitionFade from 'commun/vues/transition_fade';
 import { traduction } from 'commun/infra/internationalisation';
-import { DEMARRE } from '../modeles/store';
 
 const LARGEUR_SCENE = 1008;
 export const LARGEUR_BATIMENT = 411;
@@ -141,7 +140,8 @@ export default {
   },
 
   computed: {
-    ...mapState(['situations', 'estConnecte', 'situationsFaites', 'etat', 'nomCampagne']),
+    ...mapState(['situations', 'estConnecte', 'situationsFaites', 'nomCampagne']),
+    ...mapGetters(['estDemarre', 'estTermine']),
 
     afficheConsigne () {
       return this.estDemarre && this.indexBatiment === 0;
@@ -159,10 +159,6 @@ export default {
       return this.indexBatiment === this.niveauMax;
     },
 
-    termine () {
-      return this.situationsFaites.length >= this.situations.length;
-    },
-
     batiments () {
       const situations = this.situations.map(({ nom, chemin, identifiant }) => {
         return {
@@ -193,10 +189,6 @@ export default {
       const batiment = this.batiments[this.indexBatiment];
       return batiment && (batiment.action || batiment.chemin);
     },
-
-    estDemarre () {
-      return this.etat === DEMARRE;
-    }
   },
 
   mounted () {
@@ -237,7 +229,7 @@ export default {
     glisseVersDernierBatimentNonVisite () {
       this.indexBatiment = this.niveauMax;
 
-      if(this.termine) {
+      if(this.estTermine) {
         this.$store.dispatch('termineEvaluation');
       }
     },

tests/situations/accueil/modeles/store.test.js

@@ -270,5 +270,36 @@ describe("Le store de l'accueil", function () {
         expect(erreur.message).toEqual('non gérée');
       });
     });
+
+    describe('#estTermine', function () {
+      const situation = { nom_technique: 'inventaire' };
+
+      it("n'indique pas l'évaluation terminée tant que les situations n'ont pas été mise à jour", function () {
+        registreUtilisateur.situationsFaites = () => ['inventaire'];
+        const store = creeStore(registreUtilisateur);
+        expect(store.getters.estTermine).toBe(false);
+      });
+
+      it("faux lorsque toute les situations n'ont pas été faites", function () {
+        registreUtilisateur.situationsFaites = () => [];
+        const store = creeStore(registreUtilisateur);
+        store.commit('metsAJourSituations', [situation]);
+        expect(store.getters.estTermine).toBe(false);
+      });
+
+      it('vraie lorsque toute les situations ont été faites', function () {
+        registreUtilisateur.situationsFaites = () => ['inventaire'];
+        const store = creeStore(registreUtilisateur);
+        store.commit('metsAJourSituations', [situation]);
+        expect(store.getters.estTermine).toBe(true);
+      });
+
+      it("toujours vraie lorsque qu'on dépasse le nombre de situations à faire", function () {
+        registreUtilisateur.situationsFaites = () => ['inventaire', 'tri'];
+        const store = creeStore(registreUtilisateur);
+        store.commit('metsAJourSituations', [situation]);
+        expect(store.getters.estTermine).toBe(true);
+      });
+    });
   });
 });

tests/situations/accueil/vues/accueil.test.js

@@ -6,14 +6,17 @@ import AccesSituation from 'accueil/vues/acces_situation';
 import FormulaireIdentification from 'accueil/vues/formulaire_identification';
 import IntroConsigne from 'commun/vues/intro_consigne';
 import { traduction } from 'commun/infra/internationalisation';
-import { DECONNECTE, DEMARRE } from 'accueil/modeles/store';
 
 describe('La vue accueil', function () {
   let depotRessources;
   let store;
   let localVue;
+  let mockEstTermine;
+  let mockDeconnecte;
 
   beforeEach(function () {
+    mockEstTermine = jest.fn();
+    mockDeconnecte = jest.fn();
     window.localStorage.removeItem(CLE_ETAT_ACCUEIL);
     depotRessources = new class {
       fondAccueil () {
@@ -38,7 +41,15 @@ describe('La vue accueil', function () {
         situations: [{}, {}],
         estConnecte: false,
         situationsFaites: [],
-        etat: DECONNECTE
+        estDemarre : false
+      },
+
+      getters: {
+        estDemarre: (state) => state.estDemarre,
+        estTermine: mockEstTermine
+      },
+      actions: {
+        deconnecte: mockDeconnecte
       }
     });
     localVue = createLocalVue();
@@ -86,23 +97,9 @@ describe('La vue accueil', function () {
     });
   });
 
-  it('déconnecte si un code campagne est passé en propsData', function (done) {
-    let deconnecte = false;
-    store = new Vuex.Store({
-      state: {
-        situations: [],
-        situationsFaites: []
-      },
-      actions: {
-        deconnecte () { deconnecte = true; }
-      }
-    });
-
-    const wrapper = accueil({ forceCampagne: 'CODECAMPAGNE' });
-    wrapper.vm.$nextTick(() => {
-      expect(deconnecte).toEqual(true);
-      done();
-    });
+  it('déconnecte si un code campagne est passé en propsData', function () {
+    accueil({ forceCampagne: 'CODECAMPAGNE' });
+    expect(mockDeconnecte).toHaveBeenCalled();
   });
 
   describe('#recupereSituations', function () {
@@ -210,30 +207,6 @@ describe('La vue accueil', function () {
     });
   });
 
-  describe('#terminé', function () {
-    let wrapper;
-
-    beforeEach(function () {
-      store.state.situations = [{ nom: 'Inventaire' }];
-      wrapper = accueil();
-    });
-
-    it("faux lorsque toute les situations n'ont pas été faites", function () {
-      expect(wrapper.vm.termine).toBe(false);
-    });
-
-    it('vraie lorsque toute les situations ont été faites', function () {
-      store.state.situationsFaites.push('Inventaire');
-      expect(wrapper.vm.termine).toBe(true);
-    });
-
-    it("toujours vraie lorsque qu'on dépasse le nombre de situations à faire", function () {
-      store.state.situationsFaites.push('Inventaire');
-      store.state.situationsFaites.push('Tri');
-      expect(wrapper.vm.termine).toBe(true);
-    });
-  });
-
   describe('#precedentDesactivee', function () {
     let wrapper;
 
@@ -315,7 +288,7 @@ describe('La vue accueil', function () {
     it('affiche la consigne une fois démarré puis la masque', function (done) {
       const wrapper = accueil();
       expect(wrapper.findComponent(IntroConsigne).exists()).toBe(false);
-      store.state.etat = DEMARRE;
+      store.state.estDemarre = true;
       wrapper.vm.indexBatiment = 0;
 
       wrapper.vm.$nextTick(() => {
@@ -339,8 +312,7 @@ describe('La vue accueil', function () {
     let wrapper;
 
     beforeEach(function () {
-      store.state.situations = [{ nom: 'Inventaire' }];
-      store.state.situationsFaites = ['Inventaire'];
+      mockEstTermine.mockReturnValueOnce(true);
       wrapper = accueil();
     });