TEST: Delete a picture from a document (see #187).

Co-authored-by: lucas-rubagotti <lucas.rubagotti@utt.fr>

Author: FredWantou

frontend/scenarios/delete_image_in_document.feature

@@ -2,24 +2,11 @@
 
 Fonctionnalité: Supprimer à l'intérieur d'un document une image
 
-  Scénario: qui existe
+  Scénario:
 
-    Soit un document existant affiché comme document principal
-    Et contient l'image "diagramme de classe"
+    Soit le document contenant l'image "graphique" affiché comme document principal
     Et une session active avec mon compte
-    Quand j'essaie de supprimer l'image "diagramme de classe"
-    Alors je ne vois plus l'image "diagramme de classe" dans la glose
-  
-  Scénario: qui n'existe pas
-
-    Soit un document existant affiché comme document principal
-    Et contient l'image "diagramme de classe" 
-    Et contient l'image "graphique"
-    Et une session active avec mon compte
-    Quand j'essaie de supprimer l'image "diagramme de classe"
-    Alors je ne vois plus l'image "diagramme de classe" dans la glose
-    Et je vois toujours l'image "graphique" dans la glose
-
-
-
-  
+    Et une glose qui contient l'image "<IMAGE DESCRIPTION>"
+    Quand j'essaie de supprimer l'image "<IMAGE DESCRIPTION>"
+    Alors je ne vois plus l'image "<IMAGE DESCRIPTION>" dans la glose
+    Et je vois l'image "graphique" dans la glose

frontend/tests/context.js

@@ -102,4 +102,38 @@ Soit ("qui n'a pas de document source", () => {
 
 Soit ("qui a un document source", () => {
   cy.get('.sources').find('.card-body').should('exist');
-});
+});
+
+Soit("le document contenant l'image {string} affiché comme document principal", (alt) => {
+  cy.sign_in('alice','/');
+  cy.create_glose();
+
+  context = cy.get('.scholium').eq(1);
+  cy.click_on_contextual_menu_item(context, 'Add a picture...');
+  cy.get('[id="image-input"]').selectFile('../docs/component_bookshelf.png', {
+    force: true,
+  })
+
+  cy.get('img[alt="<IMAGE DESCRIPTION>"]',{ timeout: 10000 }) 
+  .should('be.visible')
+
+  cy.click_on_text('content');
+  cy.get('textarea') 
+      .invoke('val')
+      .then((text) => {
+        const updatedText = text.replace(/\!\[.*?\]/, `![${alt}]`);
+        cy.get('textarea').clear().type(updatedText, { delay: 0 });
+      });
+  cy.sign_out()
+});
+
+Soit("une glose qui contient l'image {string}", (altText) => {
+
+  context = cy.get('.scholium').eq(1);
+  cy.click_on_contextual_menu_item(context, 'Add a picture...');
+  cy.get('[id="image-input"]').selectFile('../docs/architecture.png', {
+    force: true,
+  });
+
+});
+

frontend/tests/event.js

@@ -95,5 +95,14 @@ Quand("j'essaye d'ajouter une image à une glose", () => {
   cy.get('[id="image-input"]').selectFile('../docs/architecture.png', {
     force: true,
   });
+  cy.get('img[alt="<IMAGE DESCRIPTION>"]',{ timeout: 10000 }) 
+  .should('be.visible')
 });
+
+Quand("j'essaie de supprimer l'image {string}", (alt) => {
+  cy.get(`img[alt="${alt}"]`).scrollIntoView().should('be.visible')
+    .parents('figure')
+    .find('.trash-overlay')
+    .click({ force: true }); 
+  cy.contains('button', 'Supprimer').click()
 });

frontend/tests/outcome.js

@@ -100,4 +100,8 @@ Alors("la rubrique {string} est associée au passage {string}", (rubric, text) =
 Alors("{string} est la glose ouverte en mode édition", (title) => {
   cy.get('.runningHead .scholium').should('contain', title);
   cy.get('.scholium').should('have.descendants', 'form');
+});
+
+Alors("je ne vois plus l'image {string} dans la glose", (alt) => {
+  cy.get('.row:not(.runningHead)>.scholium').should('not.have.descendants', `img[alt='${alt}']`);
 });