Set Up Unit Test Cases for Frontend

[ishaanxgupta]

Description:
To ensure the robustness and stability of the frontend, we need to set up unit test cases that will cover various aspects of the application. The goal is to improve code quality, reduce bugs, and provide confidence when making changes or adding new features.

Tasks:
Install Testing Framework:
Install and configure a testing framework suitable for React (e.g., Jest with React Testing Library).

Write Unit Tests for Components:
Write tests for individual React components to ensure they behave as expected.
Focus on testing component rendering, state changes, props, and events.
Ensure that all major components have at least one test case.

Test Integration with APIs:
Mock API calls and test how the components handle different responses (success, failure, loading states).
Use tools like msw or jest-fetch-mock for mocking API requests.

Test User Interactions:
Write tests to simulate user interactions such as clicks, form submissions, and input changes.
Ensure that components respond correctly to user actions.

Test Styling and Visuals:
Verify that components are rendering with the correct styles, classes, and attributes.

Ensure Test Coverage:
Aim for good test coverage to catch edge cases and prevent regressions.
Consider using code coverage tools to monitor the percentage of the codebase covered by tests.

Documentation:
Update the README or contributing guide to include instructions on how to run frontend tests locally.

Acceptance Criteria:

• All major frontend components have unit tests.
• Tests are organized and easy to maintain.
• External dependencies (e.g., API calls) are mocked properly.
• All tests pass when executed using Jest.
• A clear guide is available on how to run frontend tests locally.

[syedali237]

Can I work on this alongside you, as it involves multiple component.