Corriger des tests et auto-fix des problèmes de style

client/babel.config.cjs

@@ -1,4 +1,4 @@
-/* eslint-disable no-undef */
+ 
 module.exports = {
     presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-typescript']
 };

client/jest.config.cjs

@@ -1,4 +1,4 @@
-/* eslint-disable no-undef */
+ 
 /** @type {import('ts-jest').JestConfigWithTsJest} */
 
 module.exports = {

client/jest.setup.cjs

@@ -1,3 +1,3 @@
-/* eslint-disable no-undef */
+ 
 process.env.VITE_BACKEND_URL = 'http://localhost:4000/';
 process.env.VITE_BACKEND_SOCKET_URL = 'https://ets-glitch-backend.glitch.me/';

client/src/__tests__/Types/StudentType.test.tsx

@@ -12,6 +12,6 @@ describe('StudentType', () => {
 
         expect(user.name).toBe('Student');
         expect(user.id).toBe('123');
-        expect(user.answers.length).toBe(0);
+        expect(user.answers).toHaveLength(0);
     });
 });

client/src/__tests__/components/GiftTemplate/GIFTTemplatePreview.test.tsx

@@ -5,47 +5,64 @@ import GIFTTemplatePreview from 'src/components/GiftTemplate/GIFTTemplatePreview
 
 describe('GIFTTemplatePreview Component', () => {
   test('renders error message when questions contain invalid syntax', () => {
-    render(<GIFTTemplatePreview questions={['Invalid GIFT syntax']} />);
+    render(<GIFTTemplatePreview questions={[':: title']} />);
-    const errorMessage = screen.findByText(/Erreur inconnue/i, {}, { timeout: 5000 });
+    const errorMessage = screen.getByText(/Title ::, Category, Description, or Question formatted stem but ":" found./i);
-    expect(errorMessage).resolves.toBeInTheDocument();
+    expect(errorMessage).toBeInTheDocument();
   });
+
   test('renders preview when valid questions are provided', () => {
     const questions = [
-      'Question 1 { A | B | C }',
+      'Stem1 {=ans1 ~ans2 ~ans3}',
-      'Question 2 { D | E | F }',
     ];
     render(<GIFTTemplatePreview questions={questions} />);
     const previewContainer = screen.getByTestId('preview-container');
     expect(previewContainer).toBeInTheDocument();
+    // const question1 = screen.getByText('Stem1');
+    const mcQuestion1 = screen.getByText('Stem1');
+    const ans1 = screen.getByText('ans1');
+    const ans2 = screen.getByText('ans2');
+    const ans3 = screen.getByText('ans3');
+    expect(mcQuestion1).toBeInTheDocument();
+    expect(ans1).toBeInTheDocument();
+    expect(ans2).toBeInTheDocument();
+    expect(ans3).toBeInTheDocument();
+
+    // each answer should have a radio button before it
+    const radioButtons = screen.getAllByRole('radio');
+    expect(radioButtons).toHaveLength(3);
+    // ans1 should be the <label> for the first radio button
+    expect(radioButtons[0].nextElementSibling).toBe(ans1);
+    // ans2 should be the <label> for the second radio button
+    expect(radioButtons[1].nextElementSibling).toBe(ans2);
+    // ans3 should be the <label> for the third radio button
+    expect(radioButtons[2].nextElementSibling).toBe(ans3);
+
+    // after the <label> for correct answer (ans1) there should be an svg with aria-hidden="true"
+    expect(ans1.nextElementSibling).toHaveAttribute('aria-hidden', 'true');
+    // after the <label> for incorrect answer (ans2) there should be an svg with aria-hidden="true"
+    expect(ans2.nextElementSibling).toHaveAttribute('aria-hidden', 'true');
+    // after the <label> for incorrect answer (ans3) there should be an svg with aria-hidden="true"
+    expect(ans3.nextElementSibling).toHaveAttribute('aria-hidden', 'true');
+
   });
-  test('hides answers when hideAnswers prop is true', () => {
+  test('hides correct/incorrect answers when hideAnswers prop is true', () => {
     const questions = [
-      'Question 1 { A | B | C }',
+      'Stem1 {=ans1 ~ans2 ~ans3}',
-      'Question 2 { D | E | F }',
     ];
     render(<GIFTTemplatePreview questions={questions} hideAnswers />);
     const previewContainer = screen.getByTestId('preview-container');
     expect(previewContainer).toBeInTheDocument();
+    const ans1 = screen.queryByText('ans1');
+    const ans2 = screen.queryByText('ans2');
+    const ans3 = screen.queryByText('ans3');
+
+    const radioButtons = screen.getAllByRole('radio');
+    expect(radioButtons).toHaveLength(3);
+    expect(radioButtons[0].nextElementSibling).toBe(ans1);
+    expect(ans1?.nextElementSibling).toBeNull();
+    expect(radioButtons[1].nextElementSibling).toBe(ans2);
+    expect(ans2?.nextElementSibling).toBeNull();
+    expect(radioButtons[2].nextElementSibling).toBe(ans3);
+    expect(ans3?.nextElementSibling).toBeNull();
   });
-  // it('renders images correctly', () => {
-  //   const questions = [
-  //     'Question 1',
-  //     '<img src="image1.jpg" alt="Image 1">',
-  //     'Question 2',
-  //     '<img src="image2.jpg" alt="Image 2">',
-  //   ];
-  //   const { getByAltText } = render(<GIFTTemplatePreview questions={questions} />);
-  //   const image1 = getByAltText('Image 1');
-  //   const image2 = getByAltText('Image 2');
-  //   expect(image1).toBeInTheDocument();
-  //   expect(image2).toBeInTheDocument();
-  // });
-  // it('renders non-images correctly', () => {
-  //   const questions = ['Question 1', 'Question 2'];
-  //   const { queryByAltText } = render(<GIFTTemplatePreview questions={questions} />);
-  //   const image1 = queryByAltText('Image 1');
-  //   const image2 = queryByAltText('Image 2');
-  //   expect(image1).toBeNull();
-  //   expect(image2).toBeNull();
-  // });
 });

client/src/__tests__/components/GiftTemplate/TextType.test.ts

@@ -54,10 +54,10 @@ describe('TextType', () => {
             format: ''
         };
 
-        // eslint-disable-next-line no-irregular-whitespace
+         
         // warning: there are zero-width spaces "​" in the expected output -- you must enable seeing them with an extension such as Gremlins tracker in VSCode
 
-        // eslint-disable-next-line no-irregular-whitespace
+         
         const expectedOutput = `Inline matrix: <span class="katex"><span class="katex-mathml"><math xmlns="http://www.w3.org/1998/Math/MathML"><mrow><mo fence="true">(</mo><mtable rowspacing="0.16em"><mtr><mtd><mstyle displaystyle="false" scriptlevel="0"><mi>a</mi></mstyle></mtd><mtd><mstyle displaystyle="false" scriptlevel="0"><mi>b</mi></mstyle></mtd></mtr><mtr><mtd><mstyle displaystyle="false" scriptlevel="0"><mi>c</mi></mstyle></mtd><mtd><mstyle displaystyle="false" scriptlevel="0"><mi>d</mi></mstyle></mtd></mtr></mtable><mo fence="true">)</mo></mrow> \\begin{pmatrix} a &amp; b \\\\ c &amp; d \\end{pmatrix} </math></span><span aria-hidden="true" class="katex-html"><span class="base"><span style="height:2.4em;vertical-align:-0.95em;" class="strut"></span><span class="minner"><span style="top:0em;" class="mopen delimcenter"><span class="delimsizing size3">(</span></span><span class="mord"><span class="mtable"><span class="col-align-c"><span class="vlist-t vlist-t2"><span class="vlist-r"><span style="height:1.45em;" class="vlist"><span style="top:-3.61em;"><span style="height:3em;" class="pstrut"></span><span class="mord"><span class="mord mathnormal">a</span></span></span><span style="top:-2.41em;"><span style="height:3em;" class="pstrut"></span><span class="mord"><span class="mord mathnormal">c</span></span></span></span><span class="vlist-s">​</span></span><span class="vlist-r"><span style="height:0.95em;" class="vlist"><span></span></span></span></span></span><span style="width:0.5em;" class="arraycolsep"></span><span style="width:0.5em;" class="arraycolsep"></span><span class="col-align-c"><span class="vlist-t vlist-t2"><span class="vlist-r"><span style="height:1.45em;" class="vlist"><span style="top:-3.61em;"><span style="height:3em;" class="pstrut"></span><span class="mord"><span class="mord mathnormal">b</span></span></span><span style="top:-2.41em;"><span style="height:3em;" class="pstrut"></span><span class="mord"><span class="mord mathnormal">d</span></span></span></span><span class="vlist-s">​</span></span><span class="vlist-r"><span style="height:0.95em;" class="vlist"><span></span></span></span></span></span></span></span><span style="top:0em;" class="mclose delimcenter"><span class="delimsizing size3">)</span></span></span></span></span></span>`;
         expect(FormattedTextTemplate(input)).toContain(expectedOutput);
     });

client/src/__tests__/components/GiftTemplate/constants/styles.test.tsx

@@ -28,7 +28,7 @@ function convertStylesToObject(styles: string): React.CSSProperties {
     styles.split(';').forEach((style) => {
         const [property, value] = style.split(':');
         if (property && value) {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+             
             (styleObject as any)[property.trim()] = value.trim();
         }
     });

client/src/components/StudentModeQuiz/StudentModeQuiz.tsx

@@ -12,7 +12,7 @@ import { Question } from 'gift-pegjs';
 
 interface StudentModeQuizProps {
     questions: QuestionType[];
-    submitAnswer: (answer: string | number | boolean, idQuestion: number) => void;
+    submitAnswer: (_answer: string | number | boolean, _idQuestion: number) => void;
     disconnectWebSocket: () => void;
 }
 

client/src/components/StudentWaitPage/StudentWaitPage.tsx

@@ -9,7 +9,7 @@ import './studentWaitPage.css';
 interface Props {
     students: StudentType[];
     launchQuiz: () => void;
-    setQuizMode: (mode: 'student' | 'teacher') => void;
+    setQuizMode: (_mode: 'student' | 'teacher') => void;
 }
 
 const StudentWaitPage: React.FC<Props> = ({ students, launchQuiz, setQuizMode }) => {

client/src/components/TeacherModeQuiz/TeacherModeQuiz.tsx

@@ -12,7 +12,7 @@ import { Question } from 'gift-pegjs';
 
 interface TeacherModeQuizProps {
     questionInfos: QuestionType;
-    submitAnswer: (answer: string | number | boolean, idQuestion: number) => void;
+    submitAnswer: (_answer: string | number | boolean, _idQuestion: number) => void;
     disconnectWebSocket: () => void;
 }
 

client/src/pages/Teacher/Dashboard/Dashboard.tsx

@@ -196,8 +196,7 @@ const Dashboard: React.FC = () => {
                 // questions[i] = QuestionService.ignoreImgTags(questions[i]);
                 const parsedItem = parse(questions[i]);
                 Template(parsedItem[0]);
-            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            } catch (_error) {
-            } catch (error) {
                 return false;
             }
         }

client/src/pages/Teacher/EditorQuiz/EditorQuiz.tsx

@@ -182,8 +182,7 @@ const QuizForm: React.FC = () => {
             if (fileInputRef.current) {
                 fileInputRef.current.value = '';
             }
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        } catch (_error) {
-        } catch (error) {
             window.alert(`Une erreur est survenue.\n Veuillez réessayer plus tard`)
 
         }

client/src/pages/Teacher/ManageRoom/ManageRoom.tsx

@@ -125,7 +125,6 @@ const ManageRoom: React.FC = () => {
         // This is here to make sure the correct value is sent when user join
         if (socket) {
             console.log(`Listening for user-joined in room ${roomName}`);
-            // eslint-disable-next-line @typescript-eslint/no-unused-vars
             socket.on('user-joined', (_student: StudentType) => {
                 if (quizMode === 'teacher') {
                     webSocketService.nextQuestion(roomName, currentQuestion);