From 17beee4d4cd672f1662312781202bbb1b2c87058 Mon Sep 17 00:00:00 2001
From: sergiorodriguezgarcia
 <113514397+sergiorodriguezgarcia@users.noreply.github.com>
Date: Mon, 4 Mar 2024 17:20:18 +0100
Subject: [PATCH] fix: Changing the Signup.test to pass with the new
 conventions

---
 webapp/src/pages/Signup.jsx     |  4 ++--
 webapp/src/tests/Signup.test.js | 10 +++++-----
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/webapp/src/pages/Signup.jsx b/webapp/src/pages/Signup.jsx
index 8a64926e..bfba8cca 100644
--- a/webapp/src/pages/Signup.jsx
+++ b/webapp/src/pages/Signup.jsx
@@ -105,7 +105,7 @@ export default function Signup() {
                                     onChange={(e) => setPassword(e.target.value)}
                                 />
                                 <InputRightElement width="4.5rem">
-                                    <Button h="1.75rem" size="sm" onClick={() => setShowPassword(!showPassword)}>
+                                    <Button data-testid="show-confirm-password-button" h="1.75rem" size="sm" onClick={() => setShowPassword(!showPassword)}>
                                         {showPassword ? <ViewOffIcon/> : <ViewIcon/>}
                                     </Button>
                                 </InputRightElement>
@@ -121,7 +121,7 @@ export default function Signup() {
                                     onChange={(e) => setConfirmPassword(e.target.value)}
                                 />
                                 <InputRightElement width="4.5rem">
-                                    <Button h="1.75rem" size="sm" onClick={() => setShowConfirmPassword(!showConfirmPassword)}>
+                                    <Button data-testid="show-confirm-password-button" h="1.75rem" size="sm" onClick={() => setShowConfirmPassword(!showConfirmPassword)}>
                                         {showConfirmPassword ? <ViewOffIcon/> : <ViewIcon/>}
                                     </Button>
                                 </InputRightElement>
diff --git a/webapp/src/tests/Signup.test.js b/webapp/src/tests/Signup.test.js
index e441449a..7b0416bb 100644
--- a/webapp/src/tests/Signup.test.js
+++ b/webapp/src/tests/Signup.test.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, fireEvent, waitFor } from '@testing-library/react';
+import { render, fireEvent, waitFor, getByTestId, getAllByTestId } from '@testing-library/react';
 import axios from 'axios';
 import { MemoryRouter, createMemoryRouter } from 'react-router';
 import Signup from '../pages/Signup';
@@ -13,7 +13,7 @@ describe('Signup Component', () => {
     expect(getByPlaceholderText('session.username')).toBeInTheDocument();
     expect(getByPlaceholderText('session.password')).toBeInTheDocument();
     expect(getByPlaceholderText('session.confirm_password')).toBeInTheDocument();
-    expect(getByText('Sign Up')).toBeInTheDocument();
+    expect(getByTestId(document.body, 'Sign up')).toBeInTheDocument();
   });
 
   it('toggles password visibility', () => {
@@ -21,8 +21,8 @@ describe('Signup Component', () => {
   
     const passwordInput = getByPlaceholderText('session.password');
     const confirmPasswordInput = getByPlaceholderText('session.confirm_password');
-    const showPasswordButtons = getAllByRole('button', { name: /Show/i });
-  
+    const showPasswordButtons = getAllByTestId(document.body, 'show-confirm-password-button');
+
     fireEvent.click(showPasswordButtons[0]);
     fireEvent.click(showPasswordButtons[1]);
   
@@ -41,7 +41,7 @@ describe('Signup Component', () => {
     const emailInput = getByPlaceholderText('session.email');
     const usernameInput = getByPlaceholderText('session.username');
     const passwordInput = getByPlaceholderText('session.password');
-    const signUpButton = getByText('Sign Up');
+    const signUpButton = getByTestId(document.body, 'Sign up');
     
     // Fill out the form with valid data and submit it
     fireEvent.change(emailInput, { target: { value: 'test@example.com' } });