Intentando refactorizar codigo

Arquisoft · Apr 28, 2024 · 49ba828 · 49ba828
1 parent 69b1053
commit 49ba828
Showing 1 changed file with 29 additions and 68 deletions.
diff --git a/webapp/src/components/RankingList.test.js b/webapp/src/components/RankingList.test.js
@@ -3,6 +3,7 @@ import { render, screen, waitFor, act } from '@testing-library/react';
 import RankingList from './RankingList';
 import axios from 'axios';
 import MockAdapter from 'axios-mock-adapter';
+import exp from 'constants';
 
 jest.mock('axios');
 
@@ -46,21 +47,19 @@ describe('RankingList', () => {
       });
     });
 
-    function emptyFunction() {
-      return;
-    }
-
-    it('renders without crashing', async () => {
+    async function renderRankingList() {
       await act(async () => {
         render(<RankingList setError={emptyFunction} />);
       });
+    }
+
+    it('renders without crashing', async () => {
+      await renderRankingList();
     });
 
 
     test('renders RankingList component and main heading', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
 
       // Check if the main heading is in the document
       const heading = screen.getByRole('heading', { name: /Top 3 usuarios con mejor porcentaje de aciertos/i });
@@ -69,9 +68,7 @@ describe('RankingList', () => {
 
     // Test for rendering the column headers
     test('renders column headers', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
 
       // Check if the column headers are in the document
       const columnHeaders = screen.getAllByRole('columnheader');
@@ -80,19 +77,15 @@ describe('RankingList', () => {
 
     // Test for rendering the table
     it('should display the table', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
 
       const table = screen.getByRole('table');
       expect(table).toBeInTheDocument();
     });
 
 
     test('tests tabla ranking', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
 
       expect(screen.queryByText("Ranking")).toBeInTheDocument();
       expect(screen.getByText(/Nombre de Usuario/i)).toBeInTheDocument();
@@ -103,18 +96,14 @@ describe('RankingList', () => {
     });
 
     test('show ranking table with content', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
 
       const rows = await screen.findAllByRole('row');
       expect(rows).toHaveLength(5);
     });
 
     test('show users ordered by "porcentajeAciertos" BY DEFAULT correctly', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
 
       // We wait for the users to be loaded and the table to be updated
       let rows = await screen.findAllByRole('row');
@@ -127,16 +116,7 @@ describe('RankingList', () => {
 
     });
 
-    test('show users ordered by "username" correctly', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
-      const usernameHeader = screen.getByRole('columnheader', { name: /Nombre de Usuario/i });
-
-      await act(async() => {
-        usernameHeader.click(); // DESC
-      });
-
+    async function expectOrder(header) {
       // We wait for the users to be loaded and the table to be updated
       let rows = await screen.findAllByRole('row');
 
@@ -147,7 +127,7 @@ describe('RankingList', () => {
       expect(rows[1]).toHaveTextContent('troll');
 
       await act(async() => {
-        usernameHeader.click(); // ASC
+        header.click(); // ASC
       });
 
       // We wait for the users to be loaded and the table to be updated
@@ -158,47 +138,32 @@ describe('RankingList', () => {
       expect(rows[2]).toHaveTextContent('maría');
       expect(rows[3]).toHaveTextContent('pedro');
       expect(rows[4]).toHaveTextContent('troll');
+    }
+
+    test('show users ordered by "username" correctly', async () => {
+      await renderRankingList();
+      const usernameHeader = screen.getByRole('columnheader', { name: /Nombre de Usuario/i });
 
+      await act(async() => {
+        usernameHeader.click(); // DESC
+      });
+
+      expectOrder(usernameHeader);
     });
 
     test('show users ordered by "porcentajeAciertos" correctly', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
       const porcentajeAciertosHeader = screen.getByRole('columnheader', { name: /Porcentaje de Aciertos/i });
 
       await act(async() => {
         porcentajeAciertosHeader.click(); // ASC
       });
 
-      // We wait for the users to be loaded and the table to be updated
-      let rows = await screen.findAllByRole('row');
-
-      // We check if the first row is the one with the username 'troll'
-      expect(rows[4]).toHaveTextContent('manuel');
-      expect(rows[3]).toHaveTextContent('maría');
-      expect(rows[2]).toHaveTextContent('pedro');
-      expect(rows[1]).toHaveTextContent('troll');
-
-      await act(async() => {
-        porcentajeAciertosHeader.click(); // DESC
-      });
-
-      // We wait for the users to be loaded and the table to be updated
-      rows = await screen.findAllByRole('row');
-
-      // We check if the first row is the one with the username 'manuel'
-      expect(rows[1]).toHaveTextContent('manuel');
-      expect(rows[2]).toHaveTextContent('maría');
-      expect(rows[3]).toHaveTextContent('pedro');
-      expect(rows[4]).toHaveTextContent('troll');
-
+      expectOrder(porcentajeAciertosHeader);
     });
 
     test('show users ordered by "preguntasCorrectas" correctly', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
       const preguntasCorrectasHeader = screen.getByRole('columnheader', { name: /Preguntas Correctas/i });
 
       await act(async() => {
@@ -229,9 +194,7 @@ describe('RankingList', () => {
     });
 
     test('show users ordered by "preguntasFalladas" correctly', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
       const preguntasFalladasHeader = screen.getByRole('columnheader', { name: /Preguntas Falladas/i });
 
       await act(async() => {
@@ -262,9 +225,7 @@ describe('RankingList', () => {
     });
 
     test('show users ordered by "numeroPartidas" correctly', async () => {
-      await act(async () => {
-        render(<RankingList setError={emptyFunction} />);
-      });
+      await renderRankingList();
       const numPartidasHeader = screen.getByRole('columnheader', { name: /Número de Partidas/i });
 
       await act(async() => {