Merge pull request #151 from Arquisoft/gameCategories

Pruebas en el componente Categorias y ModeSelection

webapp/src/components/categories/categories.test.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import { render, fireEvent, screen } from '@testing-library/react';
+import Categorias from './categories';
+
+describe('Categorias', () => {
+  // Limpiar todos los elementos de localStorage antes de cada prueba
+  beforeEach(() => {
+    localStorage.clear();
+  });
+
+  it('debería renderizar todas las categorías', () => {
+    render(<Categorias />);
+    const categorias = ['Aleatorio', 'Geografia', 'Deporte', 'Politica', 'Cultura'];
+
+    categorias.forEach(categoria => {
+      expect(screen.getByText(categoria)).toBeInTheDocument();
+    });
+  });
+
+  it('debería seleccionar una categoría al hacer clic en ella', () => {
+    render(<Categorias />);
+    const button = screen.getByText('Deporte');
+
+    fireEvent.click(button);
+
+    expect(button.className).toContain('selected');
+    expect(localStorage.getItem('categoria')).toBe('deporte');
+  });
+
+  it('debería seleccionar la categoría guardada en localStorage al renderizar', () => {
+    localStorage.setItem('categoria', 'politica');
+    render(<Categorias />);
+    const button = screen.getByText('Politica');
+
+    expect(button.className).toContain('selected');
+  });
+});

webapp/src/components/gameModes/ModeSelection.test.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { render, fireEvent, screen, waitFor } from '@testing-library/react';
+import ModeSelection from './ModeSelection';
+
+jest.mock('../categories/categories', () => () => <div>Categorias</div>);
+
+describe('ModeSelection', () => {
+  // Limpiar todos los elementos de localStorage antes de cada prueba
+  beforeEach(() => {
+    localStorage.clear();
+  });
+
+  it('debería renderizar todos los modos', () => {
+    render(<ModeSelection />);
+    const modos = ['Batería de sabios', 'Descartando', 'Descubriendo ciudades', 'Solo imagenes'];
+
+    modos.forEach(modo => {
+      expect(screen.getByText(modo)).toBeInTheDocument();
+    });
+  });
+
+  it('debería seleccionar un modo al hacer clic en él', async () => {
+    render(<ModeSelection />);
+    const button = screen.getByText('Descartando');
+
+    fireEvent.click(button);
+
+    await waitFor(() => expect(button.className).toContain('selected'));
+
+    expect(localStorage.getItem('mode')).toBe('descartando');
+  });
+
+  it('debería mostrar el componente Categorias cuando se selecciona el modo "Batería de sabios"', () => {
+    render(<ModeSelection />);
+    const button = screen.getByText('Batería de sabios');
+
+    fireEvent.click(button);
+
+    expect(screen.getByText('Categorias')).toBeInTheDocument();
+  });
+});