Merge branch 'webapp_interface' of https://github.com/Arquisoft/wiq_es6c

 into webapp_interface

webapp/src/components/Button.test.js

@@ -0,0 +1,32 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react';
+import Button from './Button';
+
+
+describe('Button component', () => {
+
+    test('renders button', () => {
+        const { getByText } = render(<Button text="Click me" />);
+
+        //Comprobamos que tenemos el texto
+        expect(getByText('Click me')).toBeInTheDocument();
+    });
+
+    test('clicamos el boton', () => {
+        const handleClick = jest.fn();
+
+        const { getByText } = render(<Button text="Click me" onClick={handleClick} />);
+
+        //intentamos clicar el botón con una tecla que no sea enter
+        fireEvent.keyDown(getByText('Click me'), { key: 'Space' });
+        expect(handleClick).not.toHaveBeenCalled();
+        //hacemos click normal
+        fireEvent.click(getByText('Click me'));
+        expect(handleClick).toHaveBeenCalled();
+        //clicamos el boton con la tecla enter
+        fireEvent.keyDown(getByText('Click me'), { key: 'Enter' });
+        expect(handleClick).toHaveBeenCalled();
+
+    });
+
+});

webapp/src/components/FirstGame.test.js

@@ -1,9 +1,10 @@
-import { render, fireEvent, act } from '@testing-library/react';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { ContextFun } from './Context';
 import axios from 'axios';
 import MockAdapter from 'axios-mock-adapter';
-import {MemoryRouter} from 'react-router-dom';
+import { BrowserRouter as Router } from 'react-router-dom';
 import FirstGame from './FirstGame';
-import Menu from './Menu';
+import GameConfiguration from './game/GameConfiguration';
 
 const mockAxios = new MockAdapter(axios);
 
@@ -15,21 +16,23 @@ describe("First game component", () => {
 
     test("one question -> 4 possible answers",async () => {
         render(
-            <MemoryRouter>
-                <Menu />
-            </MemoryRouter>
+            <ContextFun>
+                <Router>
+                    <GameConfiguration />
+                </Router>
+            </ContextFun>
         );
 
-        const classicGame = document.querySelector('.modes > div > button');
-        // Simulate new Classic Game
-        await act(async () => {
-            fireEvent.click(classicGame);
-        });
-
-        console.log(document.querySelector('h1'))
-
+        //Marcar la primera temática
+        let topic1 = document.getElementById('t0');
+        fireEvent.click(topic1);
+        expect(topic1).toBeChecked();
+        //Iniciamos el juego 
+        let bt = screen.getByText('Comenzar Juego');
+        fireEvent.click(bt);  
+        //comprobamos que haya 2 botones para responder
         const gamesBT = document.getElementsByClassName('allAnswers');
-        //expect(gamesBT).toHaveLength(4);
+        //expect(gamesBT).toHaveLength(2);
     });
 
 });

webapp/src/components/Util.js

@@ -19,9 +19,6 @@ function shuffleArray(array) {
 }
 
 function secureRandomNumber(max) {
-    if (!window.crypto) {
-      return Math.floor(Math.random() * max);
-    }
     const randomBytes = new Uint32Array(1);
     window.crypto.getRandomValues(randomBytes);
     return randomBytes[0] % max;

webapp/src/components/Util.test.js

@@ -0,0 +1,48 @@
+import { shuffleArray, secureRandomNumber } from './Util';
+
+jest.mock('axios');
+
+describe('shuffleArray function', () => {
+    // Mocking window.crypto.getRandomValues
+    beforeEach(() => {
+        const max = 100;
+        global.crypto = {
+            getRandomValues: jest.fn().mockImplementation((array) => {
+                for (let i = 0; i < array.length; i++) {
+                    array[i] = i; 
+                }
+            }),
+        };
+    });
+
+    afterEach(() => {
+        jest.clearAllMocks();
+    });
+
+    test('shuffles the array', () => {
+        const array = [1, 2, 3, 4, 5];
+        const shuffledArray = shuffleArray(array);
+        expect(shuffledArray).not.toEqual(array); 
+    });
+
+    test('does not mutate the original array', () => {
+        const array = [1, 2, 3, 4, 5];
+        const originalArray = [...array]; 
+        shuffleArray(array);
+        expect(array).toEqual(originalArray); 
+    });
+});
+
+describe('secureRandomNumber function', () => {
+
+    test('generates a secure random number', () => {
+        const max = 100;
+        const randomNumber = secureRandomNumber(max);
+
+        //comprobamos que el numero obtenido es < que el máximo
+        expect(randomNumber).toBeLessThan(max);         
+        //comprobamos que el numero obtenido es >= 0
+        expect(randomNumber).toBeGreaterThanOrEqual(0); 
+    });
+
+});

webapp/src/components/game/Calculator.js

@@ -1,12 +1,12 @@
-import React, { useState, useEffect } from 'react';
+import React from 'react';
 import { shuffleArray, secureRandomNumber } from '../Util';
-import { Container, Typography, Box, LinearProgress} from '@mui/material';
+import { Container, Typography } from '@mui/material';
 import { Footer } from '../footer/Footer';
 import { Nav } from '../nav/Nav';
 import Button from '../Button';
 
-var questions = []
-var questionIndex = -1
+let questions = []
+let questionIndex = -1
 
 const Calculator = () => {