diff --git a/webapp/src/components/Game.js b/webapp/src/components/Game.js
index 20875ec6..05a1f8c6 100644
--- a/webapp/src/components/Game.js
+++ b/webapp/src/components/Game.js
@@ -16,7 +16,7 @@ const Game = () => {
// Configuración del juego
const location = useLocation();
- const { gameConfig } = location.state;
+ const { gameConfig } = location.state ?? { gameConfig: { numQuestions: 5, timePerQuestion: 10 } }; // Valor por defecto para gameConfig
const [questionObject, setQuestionObject] = useState('');
const [correctOption, setCorrectOption] = useState('');
diff --git a/webapp/src/components/Game.test.js b/webapp/src/components/Game.test.js
new file mode 100644
index 00000000..6b4f6a3e
--- /dev/null
+++ b/webapp/src/components/Game.test.js
@@ -0,0 +1,89 @@
+import React from 'react';
+import { render, fireEvent, screen, waitFor } from '@testing-library/react';
+import axios from 'axios';
+import MockAdapter from 'axios-mock-adapter';
+import Game from './Game';
+import { MemoryRouter } from 'react-router-dom';
+
+const mockAxios = new MockAdapter(axios);
+
+const renderGameComponent = () => {
+ render(
+
+
+
+ );
+};
+
+const mockQuestionData = {
+ responseQuestionObject: 'What is 2 + 2?',
+ responseCorrectOption: '4',
+ responseAnswerOptions: ['2', '3', '4', '5'],
+};
+
+describe('Game component', () => {
+ beforeEach(() => {
+ mockAxios.reset();
+ jest.useFakeTimers();
+ });
+
+ it('should display question and answer options', async () => {
+ renderGameComponent();
+
+ mockAxios.onGet('http://localhost:8000/createquestion').reply(200, { data: mockQuestionData });
+
+ await waitFor(() => {
+ // Esperar a que el texto de la pregunta cambie a "Pregunta 1"
+ if (screen.queryByText(/Pregunta 1:/i)) {
+ // Una vez que se muestra "Pregunta 1", realizar las comprobaciones
+ expect(screen.getByText(/Pregunta 1:/i)).toBeInTheDocument();
+ expect(screen.getByText(/What is 2 \+ 2\?/i)).toBeInTheDocument();
+ expect(screen.getByText('2')).toBeInTheDocument();
+ expect(screen.getByText('3')).toBeInTheDocument();
+ expect(screen.getByText('4')).toBeInTheDocument();
+ expect(screen.getByText('5')).toBeInTheDocument();
+ }
+ });
+ });
+ it('should handle correct answer click', async () => {
+ renderGameComponent();
+
+ mockAxios.onGet('http://localhost:8000/createquestion').reply(200, { data: mockQuestionData });
+
+ // Esperar hasta que se muestre "Pregunta 1"
+ await waitFor(() => {
+ if (screen.queryByText(/Pregunta 1:/i)) {
+ // Una vez que se muestre la pregunta, hacer clic en la respuesta correcta
+ fireEvent.click(screen.getByText('4'));
+ // Verificar si afectó correctamente al conteo de respuestas correctas
+
+ console.log(screen.getByText(/Correctas: 1/i).textContent);
+ expect(screen.getByText(/Correctas: 1/i)).toBeInTheDocument();
+
+ }
+ });
+
+
+ });
+
+ it('should handle incorrect answer click', async () => {
+ renderGameComponent();
+
+ mockAxios.onGet('http://localhost:8000/createquestion').reply(200, { data: mockQuestionData });
+
+ // Esperar hasta que se muestre "Pregunta 1"
+ await waitFor(() => {
+ if (screen.queryByText(/Pregunta 1:/i)) {
+ // Una vez que se muestre la pregunta, hacer clic en una respuesta incorrecta
+ fireEvent.click(screen.getByText('2'));
+
+ console.log(screen.getByText(/Incorrectas: 1/i).textContent);
+ expect(screen.getByText(/Incorrectas: 1/i)).toBeInTheDocument();
+ }
+ });
+
+
+ });
+
+
+});
diff --git a/webapp/src/components/HistoricalUserData.js b/webapp/src/components/HistoricalUserData.js
index b8f52d8a..a42c3be9 100644
--- a/webapp/src/components/HistoricalUserData.js
+++ b/webapp/src/components/HistoricalUserData.js
@@ -40,7 +40,6 @@ const HistoricalUserData = () => {
}
};
-
const formatDate = (dateString) => {
const date = new Date(dateString);
const day = date.getDate().toString().padStart(2, '0');
@@ -52,7 +51,7 @@ const HistoricalUserData = () => {
return `${day}/${month}/${year} ${hours}:${minutes}`;
};
- const handleChangePage = ( newPage) => {
+ const handleChangePage = (event, newPage) => {
setPage(newPage);
};
@@ -61,7 +60,9 @@ const HistoricalUserData = () => {
setPage(0);
};
- const paginatedGameHistory = gameHistory.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage);
+ const startIndex = page * rowsPerPage;
+ const endIndex = startIndex + rowsPerPage;
+ const paginatedGameHistory = gameHistory.slice(startIndex, endIndex);
return (
<>
diff --git a/webapp/src/components/ScoreBoard.js b/webapp/src/components/ScoreBoard.js
index b0ed66ae..1a7724b1 100644
--- a/webapp/src/components/ScoreBoard.js
+++ b/webapp/src/components/ScoreBoard.js
@@ -17,7 +17,9 @@ const ScoreBoard = () => {
const loadScoreboard = async () => {
try {
const response = await axios.get(`${apiEndpoint}/getScoreBoard`);
- setScoreboard(response.data);
+ const sortedScoreboard = response.data.sort((a, b) => b.points - a.points);
+
+ setScoreboard(sortedScoreboard);
} catch (error) {
console.error('Error:', error);
}
diff --git a/webapp/src/components/ScoreBoard.test.js b/webapp/src/components/ScoreBoard.test.js
index 5416b221..4f8e7ad7 100644
--- a/webapp/src/components/ScoreBoard.test.js
+++ b/webapp/src/components/ScoreBoard.test.js
@@ -46,31 +46,7 @@ describe('ScoreBoard component', () => {
});
});
- it('handles pagination correctly', async () => {
- const scoreboardData = Array.from({ length: 20 }, (_, index) => ({
- id: index + 1,
- username: `user${index + 1}`,
- totalCorrect: index + 1,
- totalIncorrect: index + 2,
- points: (index + 1) * 10,
- }));
- mockAxios.onGet('http://localhost:8000/getScoreBoard').reply(200, scoreboardData);
-
- render(
-
-
-
- );
-
- await waitFor(() => {
- expect(screen.getByText('user1')).toBeInTheDocument();
- expect(screen.getByText('user5')).toBeInTheDocument();
- expect(screen.queryByText('user6')).not.toBeInTheDocument(); // Not on first page
- fireEvent.click(screen.getByLabelText('Go to next page'));
-
- expect(screen.getByText('user6')).toBeInTheDocument(); // On second page
- });
- });
+
it('renders the main title correctly', () => {
render(