Enhancement: Implement Frontend Unit Testing Suite using Vitest and React Testing Library

[Xploit-Ghost]

Description

The project currently has an excellent backend testing setup utilizing Jasmine for the models and auth routes. However, there doesn't appear to be a corresponding test suite for the React/Vite frontend. As the application relies heavily on data fetching (React Query) and UI rendering (Material UI + Tailwind), adding a frontend testing framework will ensure UI reliability and prevent regressions as new features are added.

Proposed Solution

1. Install and configure Vitest (which is optimized for Vite) alongside React Testing Library.
2. Setup a vitest.config.ts (or .js) file to handle the React environment and DOM simulation (jsdom or happy-dom).
3. Write foundational unit tests for a few core UI components (e.g., the search bar, the user statistics display, or the loading states for React Query).
4. Update the package.json with a test:client script and document the frontend testing commands in the README.md to match the backend documentation.

GSSoC '26 Request

Hi maintainers! 👋 I am actively participating in GirlScript Summer of Code 2026 and would love to work on setting up this frontend testing architecture.

Could you please:

1. Assign this issue to me.
2. Add the gssoc26, enhancement, and testing labels to this thread?

Thank you! I am ready with the solution and would love to contribute towards this project.

[Xploit-Ghost]

Hi maintainers! 👋

I've just opened a PR that introduces the frontend testing architecture we discussed. I've configured Vitest, added the necessary package.json scripts, and included foundational tests for the Navbar and ActivityFeed components.

You can review the implementation here: #615

Please tell me if its good to go or if it needs some more changes. Thank you for your time.