Merge pull request #90 from Arquisoft/fix-tests

feat: adding the login tests.

webapp/src/tests/Login.test.js

@@ -0,0 +1,64 @@
+import React from 'react';
+import { render, fireEvent, waitFor, getByTestId, getAllByTestId } from '@testing-library/react';
+import axios from 'axios';
+import { MemoryRouter } from 'react-router';
+import Signup from '../pages/Signup';
+
+describe('Signup Component', () => {
+
+  it('renders form elements correctly', () => {
+    const { getByPlaceholderText } = render(<MemoryRouter><Signup /></MemoryRouter>);
+
+    expect(getByPlaceholderText('session.email')).toBeInTheDocument();
+    expect(getByPlaceholderText('session.username')).toBeInTheDocument();
+    expect(getByPlaceholderText('session.password')).toBeInTheDocument();
+    expect(getByPlaceholderText('session.confirm_password')).toBeInTheDocument();
+    expect(getByTestId(document.body, 'Sign up')).toBeInTheDocument();
+  });
+
+  it('toggles password visibility', () => {
+    const { getByPlaceholderText } = render(<MemoryRouter><Signup /></MemoryRouter>);
+
+    const passwordInput = getByPlaceholderText('session.password');
+    const confirmPasswordInput = getByPlaceholderText('session.confirm_password');
+    const showPasswordButtons = getAllByTestId(document.body, 'show-confirm-password-button');
+
+    fireEvent.click(showPasswordButtons[0]);
+    fireEvent.click(showPasswordButtons[1]);
+
+    expect(passwordInput.getAttribute('type')).toBe('text');
+    expect(confirmPasswordInput.getAttribute('type')).toBe('text');
+  });
+
+  it('submits form data correctly', async () => {
+    const axiosMock = jest.spyOn(axios, 'post');
+    axiosMock.mockResolvedValueOnce({ status: 202 }); // Accepted status code
+
+    // Render the Signup component
+    const { getByPlaceholderText } = render(<MemoryRouter><Signup /></MemoryRouter>);
+
+    // Get form elements and submit button by their text and placeholder values
+    const emailInput = getByPlaceholderText('session.email');
+    const usernameInput = getByPlaceholderText('session.username');
+    const passwordInput = getByPlaceholderText('session.password');
+    const signUpButton = getByTestId(document.body, 'Sign up');
+
+    // Fill out the form with valid data and submit it
+    fireEvent.change(emailInput, { target: { value: '[email protected]' } });
+    fireEvent.change(usernameInput, { target: { value: 'testuser' } });
+    fireEvent.change(passwordInput, { target: { value: 'password' } });
+    fireEvent.click(signUpButton);
+
+    // Check if the form data was sent correctly
+    await waitFor(() => {
+      expect(axiosMock).toHaveBeenCalledWith(process.env.API_URL, {
+        email: '[email protected]',
+        username: 'testuser',
+        password: 'password'
+      });
+      expect(axiosMock).toHaveBeenCalledTimes(1);
+    });
+
+    axiosMock.mockRestore();
+  });
+});