From fad5bbe68c1e18823e63bd7403e32aa97051a605 Mon Sep 17 00:00:00 2001
From: VIAUD Nathan <nathan.viaud@inria.fr>
Date: Wed, 15 Nov 2023 17:31:20 +0100
Subject: [PATCH] Add repeat input to e2e testing
---
.../forms/components/inputs/RepeatInput.vue | 3 +-
tests/data/form/nodeForm.data.ts | 46 ++++++++++++-
tests/types/test.type.ts | 11 ++-
tests/utils/form.ts | 68 ++++++++++++-------
tests/utils/graph.ts | 1 -
5 files changed, 100 insertions(+), 29 deletions(-)
diff --git a/src/features/forms/components/inputs/RepeatInput.vue b/src/features/forms/components/inputs/RepeatInput.vue
index adb9f7f5..0d73dcee 100644
--- a/src/features/forms/components/inputs/RepeatInput.vue
+++ b/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"
diff --git a/tests/data/form/nodeForm.data.ts b/tests/data/form/nodeForm.data.ts
index f810a3b0..a6235839 100644
--- a/tests/data/form/nodeForm.data.ts
+++ b/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'
+ }
+ ]
+ }
+ ]
+ },
]
};
diff --git a/tests/types/test.type.ts b/tests/types/test.type.ts
index 2567d487..d77446f1 100644
--- a/tests/types/test.type.ts
+++ b/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
diff --git a/tests/utils/form.ts b/tests/utils/form.ts
index 9e1eb10b..4dd7e140 100644
--- a/tests/utils/form.ts
+++ b/tests/utils/form.ts
@@ -1,4 +1,4 @@
-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
diff --git a/tests/utils/graph.ts b/tests/utils/graph.ts
index c5cd7038..b515429b 100644
--- a/tests/utils/graph.ts
+++ b/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');
--
GitLab