chore: sync infra docs and coverage

frontend/src/components/Layout.test.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import ReactDOMServer from 'react-dom/server';
+import { render, screen } from '@testing-library/react';
+import { MemoryRouter } from 'react-router-dom';
 import Layout from './Layout';
 
 // Mock the AuthContext
@@ -28,40 +29,30 @@ jest.mock('react-router-dom', () => ({
 
 describe('Layout', () => {
   const renderLayout = () => {
-    const markup = ReactDOMServer.renderToStaticMarkup(<Layout />);
-    const container = document.createElement('div');
-    container.innerHTML = markup;
-    return container;
+    return render(
+      <MemoryRouter>
+        <Layout />
+      </MemoryRouter>
+    );
   };
 
-  beforeEach(() => {
-    mockUseAuth.logout.mockClear();
-  });
-
   it('renders the layout with user information', () => {
-    const container = renderLayout();
-    const branding = Array.from(container.querySelectorAll('h1'))
-      .map((node) => node.textContent);
-    expect(branding).toContain('MerchantsOfHope-SupplyANdDemandPortal');
-
-    const textContent = container.textContent || '';
-    expect(textContent).toContain('John Doe');
-    expect(textContent).toContain('candidate');
+    renderLayout();
+    expect(screen.getAllByText('MerchantsOfHope-SupplyANdDemandPortal').length).toBeGreaterThan(0);
+    expect(screen.getAllByText('John Doe').length).toBeGreaterThan(0);
+    expect(screen.getAllByText('candidate').length).toBeGreaterThan(0);
   });
 
   it('renders navigation items for candidate role', () => {
-    const container = renderLayout();
-    const navTexts = Array.from(container.querySelectorAll('a'))
-      .map((link) => link.textContent.replace(/\s+/g, ' ').trim())
-      .filter(Boolean);
-
-    expect(navTexts).toEqual(expect.arrayContaining(['Dashboard', 'Jobs', 'Applications', 'Resumes']));
+    renderLayout();
+    expect(screen.getAllByText('Dashboard').length).toBeGreaterThan(0);
+    expect(screen.getAllByText('Jobs').length).toBeGreaterThan(0);
+    expect(screen.getAllByText('Applications').length).toBeGreaterThan(0);
+    expect(screen.getAllByText('Resumes').length).toBeGreaterThan(0);
   });
 
   it('renders logout button', () => {
-    const container = renderLayout();
-    const buttons = Array.from(container.querySelectorAll('button'))
-      .map((button) => button.textContent?.trim());
-    expect(buttons).toContain('Logout');
+    renderLayout();
+    expect(screen.getByRole('button', { name: /logout/i })).toBeInTheDocument();
   });
 });