Initial commit

frontend/src/components/Layout.test.js

@@ -0,0 +1,70 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { BrowserRouter } from 'react-router-dom';
+import Layout from './Layout';
+
+// Mock the AuthContext
+const mockUseAuth = {
+  user: {
+    id: '1',
+    firstName: 'John',
+    lastName: 'Doe',
+    email: 'john@example.com',
+    role: 'candidate'
+  },
+  logout: jest.fn()
+};
+
+jest.mock('../contexts/AuthContext', () => ({
+  useAuth: () => mockUseAuth
+}));
+
+// Mock react-router-dom
+jest.mock('react-router-dom', () => ({
+  ...jest.requireActual('react-router-dom'),
+  useLocation: () => ({ pathname: '/dashboard' }),
+  Link: ({ children, to }) => <a href={to}>{children}</a>,
+  Outlet: () => <div data-testid="outlet">Outlet</div>
+}));
+
+const renderWithRouter = (component) => {
+  return render(
+    <BrowserRouter>
+      {component}
+    </BrowserRouter>
+  );
+};
+
+describe('Layout', () => {
+  it('renders the layout with user information', () => {
+    renderWithRouter(<Layout />);
+    
+    expect(screen.getByText('MysteryApp-Cursor')).toBeInTheDocument();
+    expect(screen.getByText('John Doe')).toBeInTheDocument();
+    expect(screen.getByText('candidate')).toBeInTheDocument();
+  });
+
+  it('renders navigation items for candidate role', () => {
+    renderWithRouter(<Layout />);
+    
+    expect(screen.getByText('Dashboard')).toBeInTheDocument();
+    expect(screen.getByText('Jobs')).toBeInTheDocument();
+    expect(screen.getByText('Applications')).toBeInTheDocument();
+    expect(screen.getByText('Resumes')).toBeInTheDocument();
+  });
+
+  it('renders logout button', () => {
+    renderWithRouter(<Layout />);
+    
+    expect(screen.getByText('Logout')).toBeInTheDocument();
+  });
+
+  it('calls logout when logout button is clicked', () => {
+    renderWithRouter(<Layout />);
+    
+    const logoutButton = screen.getByText('Logout');
+    logoutButton.click();
+    
+    expect(mockUseAuth.logout).toHaveBeenCalled();
+  });
+});