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

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

Author: 2 people

frontend/scenarios/delete_image_in_document.feature

@@ -2,24 +2,10 @@
 
 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
-
-
-
-  
+    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,44 @@ 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>"]') 
+  .should('not.be.visible')
+
+  cy.click_on_text('content');
+  cy.get('textarea')
+      .should('be.visible') 
+      .should(($textarea) => {
+      expect($textarea.val().trim()).not.to.be.empty;
+    })
+      .invoke('val')
+      .then((text) => {
+        const updatedText = text.replace(/\!\[.*?\]/, `![${alt}]`);
+        cy.get('textarea').clear().type(updatedText);
+      });
+  cy.get('body').click(0, 0); 
+  
+  cy.get('img[alt="graphique"]') 
+  .should('be.visible')
+
+  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,
+  });
+  cy.get('img[alt="<IMAGE DESCRIPTION>"]') 
+  .should('be.visible')
+  cy.sign_out()
+});
+

frontend/tests/event.js

@@ -95,5 +95,12 @@ 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(`button.trash-overlay[aria-label="Delete image ${alt}"]`).scrollIntoView().click({ force: true });
+  cy.contains('button', 'Delete').click();
+});
+

frontend/tests/outcome.js

@@ -13,7 +13,8 @@ Alors("je peux lire {string}", (text) => {
 });
 
 Alors("je vois l'image {string} dans la glose", (alternative_text) => {
-  cy.get('.row:not(.runningHead)>.scholium').should('have.descendants', `img[alt='${alternative_text}']`);
+  cy.get(`img[alt="${alternative_text}"]`)
+    .should('be.visible');
 });
 
 Alors("{string} est le document principal", (title) => {
@@ -100,4 +101,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}']`);
 });