test: Add Vitest + React Testing Library setup (Refs #2)

Frontend/package.json

@@ -3,12 +3,14 @@
   "private": true,
   "version": "0.0.0",
   "type": "module",
-  "scripts": {
+"scripts": {
   "dev": "vite",
   "build": "tsc -b && vite build",
   "lint": "eslint .",
-    "preview": "vite preview"
+  "preview": "vite preview",
-  },
+  "test": "vitest",
+  "test:run": "vitest run"
+},
   "dependencies": {
     "react": "^19.2.4",
     "react-dom": "^19.2.4",

Frontend/src/hooks/__tests__/useAuth.test.tsx

@@ -0,0 +1,33 @@
+import { render, screen } from '@testing-library/react';
+import { AuthProvider } from '../useAuth';
+import { useAuth } from '../useAuth';
+import { ReactNode } from 'react';
+
+// Test component that uses useAuth hook
+const TestComponent = () => {
+  const auth = useAuth();
+  return <div data-testid="auth-user">{auth.user?.username ?? 'null'}</div>;
+};
+
+describe('useAuth hook', () => {
+  test('throws error when used outside AuthProvider', () => {
+    // Render component without AuthProvider wrapper
+    const renderTestComponent = () => render(<TestComponent />);
+    
+    // Expect it to throw an error
+    expect(renderTestComponent).toThrow('useAuth must be used within an AuthProvider');
+  });
+
+  test('provides context through AuthProvider', () => {
+    // Render component with AuthProvider wrapper
+    render(
+      <AuthProvider>
+        <TestComponent />
+      </AuthProvider>
+    );
+    
+    // Should initially show null since no user is set
+    const authContextElement = screen.getByTestId('auth-user');
+    expect(authContextElement).toHaveTextContent('null');
+  });
+});

Frontend/src/test/setup.ts

@@ -0,0 +1,2 @@
+// Setup file for Vitest with React Testing Library
+import '@testing-library/jest-dom'