testing login page

Frontend/src/components/Login.jsx

@@ -94,11 +94,11 @@ const Login = () => {
             <form onSubmit={handleClick} className='max-w-[400px] w-full mx-auto bg-white p-4'>
                 <h2 className='text-4xl font-bold text-center py-6'>INTERNOVA.</h2>
                 <div className='flex flex-col py-2'>
-                    <label>Email</label>
+                    <label htmlFor="email">Email</label>
                     <input type="email" className='border p-2' required id="email" onChange={handleChange}/>
                 </div>
                 <div className='flex flex-col py-2'>
-                    <label>Password</label>
+                    <label htmlFor ="password" >Password</label>
                     <input type="password" className='border p-2' required id="password" onChange={handleChange}/>
                 </div>
                  {/* Displaying error message */}

Frontend/src/tests/login.test.js

@@ -0,0 +1,49 @@
+import React from 'react';
+import { render, fireEvent, waitFor, screen } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect'; // For expect(...).toBeInTheDocument()
+import Login from './../components/Login';
+import { AuthContext } from '../context/AuthContext'; // Mock the context if needed
+import { MemoryRouter } from 'react-router-dom'; // Mock the router if needed
+
+// Mock the AuthContext value
+const mockAuthContextValue = {
+  dispatch: jest.fn()
+};
+
+describe('Login Component', () => {
+  test('renders login form correctly', () => {
+    render(
+      <MemoryRouter>
+        <AuthContext.Provider value={mockAuthContextValue}>
+          <Login />
+        </AuthContext.Provider>
+      </MemoryRouter>
+    );
+
+    // Check if elements are rendered
+    expect(screen.getByText('INTERNOVA.')).toBeInTheDocument();
+    expect(screen.getByLabelText('Email')).toBeInTheDocument();
+    expect(screen.getByLabelText('Password')).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: 'Login' })).toBeInTheDocument();
+  });
+
+  test('handles user input correctly', () => {
+    render(
+      <MemoryRouter>
+        <AuthContext.Provider value={mockAuthContextValue}>
+          <Login />
+        </AuthContext.Provider>
+      </MemoryRouter>
+    );
+
+    // Simulate user input
+    fireEvent.change(screen.getByLabelText('Email'), { target: { value: '[email protected]' } });
+    fireEvent.change(screen.getByLabelText('Password'), { target: { value: 'password123' } });
+
+    // Check if input values are updated
+    expect(screen.getByLabelText('Email')).toHaveValue('[email protected]');
+    expect(screen.getByLabelText('Password')).toHaveValue('password123');
+  });
+
+  // Add more test cases as needed, such as testing form submission and API calls
+});