Add repeat input to e2e testing

src/features/forms/components/inputs/RepeatInput.vue

@@ -151,7 +151,7 @@ function dragOver(event: DragEvent) {
     >
         <!--suppress VueUnrecognizedSlot -->
         <template #item="{ element, index }">
-            <div :key="index" class="card draggable-card">
+            <div :key="index" class="card draggable-card" :data-testid="`${id}-${index}`">
                 <div
                     class="card-header" 
                     :class="{ 'border-bottom': inputs.length >= 1, 'clickable': element.action }" 
@@ -190,6 +190,7 @@ function dragOver(event: DragEvent) {
     </VueDraggable>
     <AddCard
         v-if="addButton !== false"
+        :data-testid="`${id}-add`"
         placeholder="Ajouter"
         class="add-card"
         @click="addCard"

tests/data/form/nodeForm.data.ts

@@ -22,7 +22,51 @@ const epocForm: TestForm = {
             label: 'Nombre de badge pour obtenir l\'attestation',
             value: '5',
             type: 'score'
-        }
+        },
+        {
+            id: 'authors',
+            type: 'repeat',
+            cards: [
+                {
+                    value: [
+                        {
+                            label: 'Nom',
+                            value: 'Jean Dupont',
+                            type: 'text'
+                        },
+                        {
+                            label: 'Titre',
+                            value: 'Professeur',
+                            type: 'text'
+                        },
+                        {
+                            label: 'description',
+                            value: 'Titulaire de la chaire de physique quantique',
+                            type: 'html'
+                        }
+                    ]
+                },
+                {
+                    value: [
+                        {
+                            label: 'Nom',
+                            value: 'Jeanne Dupont',
+                            type: 'text'
+                        },
+                        {
+                            label: 'Titre',
+                            value: 'Chercheuse',
+                            type: 'text'
+                        },
+                        {
+                            label: 'description',
+                            value: 'Membre du laboratoire de physique quantique',
+                            type: 'html'
+                        }
+                    ]
+                }
+            ]
+        },
     ]
 };
 

tests/types/test.type.ts

@@ -21,7 +21,16 @@ export interface TestInput {
     type: 'text' | 'html' | 'checkbox' | 'score' | 'textarea';
 }
 
+interface TestRepeatCard {
+    value: TestInput[];
+}
+export interface TestRepeatInput {
+    id: string;
+    type: 'repeat';
+    cards: TestRepeatCard[];
+}
+
 export interface TestForm {
     type: 'page' | 'epoc' | 'activity' | 'text' | 'audio' | 'video' | 'chapter' | 'choice' | 'drag-and-drop' | 'reorder' | 'swipe' | 'dropdown-list';
-    inputs: TestInput[];
+    inputs: (TestInput | TestRepeatInput)[];
 }
\ No newline at end of file

tests/utils/form.ts

-import { TestForm } from '@/tests/types';
+import { TestForm, TestInput } from '@/tests/types';
 
 async function openForm(window, testId: string) {
     const element = await window.getByTestId(testId);
@@ -21,37 +21,55 @@ async function openForm(window, testId: string) {
     await window.mouse.click(clickLocation.x, clickLocation.y);
 }
 
+async function fillInput(target, input: TestInput) {
+    switch(input.type) {
+        case 'html': {
+            const label = await target.getByText(input.label);
+            await label.click();
+            await label.pressSequentially(input.value as string);
+            break;
+        }
+        
+        case 'checkbox': {
+            const checkbox = await target.getByLabel(input.label);
+            if(input.value) await checkbox.check();
+            break;
+        }
+        
+        case 'score': {
+            const score = await target.getByLabel(input.label);
+            await score.type(input.value as string);
+            break;
+        }
+        
+        default: {
+            const inputLabel = await target.getByLabel(input.label, { exact: true });
+            await inputLabel.fill(input.value as string);
+            break;
+        }
+    }
+}
+
 export async function fillForm(window, form: TestForm, testId: string) {
     await openForm(window, testId);
     
-    //TODO: detect form type
-    
     for(const input of form.inputs) {
-        switch(input.type) {
-            case 'html': {
-                const label = await window.getByText(input.label);
-                await label.click();
-                await label.pressSequentially(input.value as string);
-                break;
-            }
         
-            case 'checkbox': {
-                const checkbox = await window.getByLabel(input.label);
-                if(input.value) await checkbox.check();
-                break;
-            }
-            
-            case 'score': {
-                const score = await window.getByLabel(input.label);
-                await score.type(input.value as string);
-                break;
-            }
+        if(input.type === 'repeat') {
+            const addButton = await window.getByTestId(`${input.id}-add`);
             
-            default: {
-                const inputLabel = await window.getByLabel(input.label, { exact: true });
-                await inputLabel.fill(input.value as string);
-                break;
+            for (const item of input.cards) {
+                const index = input.cards.indexOf(item);
+                
+                await addButton.click();
+                const card = await window.getByTestId(`${input.id}-${index}`);
+                
+                for(const repeatInput of item.value) {
+                    await fillInput(card, repeatInput);
+                }
             }
+        } else {
+            await fillInput(window, input);
         }
     }
 }
\ No newline at end of file

tests/utils/graph.ts

@@ -43,7 +43,6 @@ export async function createLinkedNode(window, sourceNode: TestNode, newNode: Te
 
 /*
     This function is used to add content to a page.
-    ! Doesn't work for the moment, not sure i can make it work.
  */
 export async function addContentToNode(window, type, node: TestNode, pos: number) {
     const questionMenu = await window.getByTestId('questions-menu');