add test cases

client/package.json

@@ -37,7 +37,7 @@
     "start": "PORT=3002 react-scripts start",
     "start-w": "set PORT=3002 && react-scripts start",
     "build": "react-scripts build",
-    "test": "jest",
+    "test": "jest --silent",
     "eject": "react-scripts eject"
   },
   "eslintConfig": {

client/src/pages/Authentication/Register.js

@@ -251,6 +251,7 @@ export default function Register() {
                 <InputRightElement h={'full'}>
                   <Button
                     variant={'ghost'}
+                    id='showBtn'
                     onClick={() => setShowPassword((showPassword) => !showPassword)}>
                     {showPassword ? <ViewIcon /> : <ViewOffIcon />}
                   </Button>

client/src/tests/Register.test.js

@@ -1,4 +1,4 @@
-import Register from '../pages/Authentication/Register'
+import Register from '../pages/Authentication/Register';
 import { render, screen, fireEvent, waitFor } from '@testing-library/react'
 import userEvent from '@testing-library/user-event';
 import * as React from 'react';
@@ -16,19 +16,34 @@ test('on initial render, the Sign up button should be pressable', () => {
 test('on initial render, the password should be hidden by default', () => {
     render(<MemoryRouter><Register /></MemoryRouter>);
 
-    const passwordInput = screen.getByRole('textbox', { name: /Password/i });
+    const passwordInput = screen.getByRole('textbox', { name: "Password" });
     expect(passwordInput.type).toBe('password');
 
 })
 
 test('when hidden button is pressed, the password should be shown', async () => {
     render(<MemoryRouter><Register /></MemoryRouter>);
 
-    const passwordInputShowBtn = screen.getByRole('button', { name: "" });
-    const passwordInput = screen.getByRole('textbox', { name: /Password/i });
+    const passwordInputShowBtn = screen.getAllByRole('button', { name: "" })[0];
+    const passwordInput = screen.getByRole('textbox', { name: "Password" });
     fireEvent.click(passwordInputShowBtn);
 
     expect(passwordInput.type).toBe('text');
 
 })
 
+test('Ensure that both password and confirm password fields are working as usual', async () => {
+    render(<MemoryRouter><Register /></MemoryRouter>);
+
+    const passwordInputShowBtn = screen.getAllByRole('button', { name: "" })[0];
+    const passwordInputShowBtn2 = screen.getAllByRole('button', { name: "" })[1];
+    const passwordInput = screen.getByRole('textbox', { name: "Password" });
+    const passwordInput2 = screen.getByRole('textbox', { name: "Confirm password" });
+    fireEvent.click(passwordInputShowBtn);
+    fireEvent.click(passwordInputShowBtn2);
+
+    expect(passwordInput.type).toBe('text');
+    expect(passwordInput2.type).toBe('text');
+
+})
+