From 56e440885397ad85e3c95bc1f32b24ba1825817e Mon Sep 17 00:00:00 2001
From: Gregory Campbell <15807475+gjcampbell777@users.noreply.github.com>
Date: Fri, 5 Jun 2026 15:37:50 -0400
Subject: [PATCH] Mock child components in App tests

---
 src/App.test.js | 49 ++++++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 44 insertions(+), 5 deletions(-)

diff --git a/src/App.test.js b/src/App.test.js
index 2b34b1b9f..81a8c8386 100644
--- a/src/App.test.js
+++ b/src/App.test.js
@@ -1,9 +1,48 @@
 import React from 'react';
-import { render } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
 import App from './App';
 
-test('renders learn react link', () => {
-  const { getByText } = render(<App />);
-  const linkElement = document.getElementById('test');
-  expect(linkElement).toBeInTheDocument();
+// Mock the child components to isolate the App component's routing logic
+jest.mock('./Home', () => ({ Home: () => <div>Mock Home</div> }));
+jest.mock('./Resume', () => ({ Resume: () => <div>Mock Resume</div> }));
+jest.mock('./Projects', () => ({ Projects: () => <div>Mock Projects</div> }));
+jest.mock('./Contact', () => ({ Contact: () => <div>Mock Contact</div> }));
+jest.mock('./404', () => ({ NoMatch: () => <div>Mock NoMatch</div> }));
+
+// Mock the layout components
+jest.mock('./components/Layout', () => ({ 
+  Layout: ({ children }) => <div data-testid="mock-layout">{children}</div> 
+}));
+jest.mock('./components/NavigationBar', () => ({ 
+  NavigationBar: () => <div>Mock NavigationBar</div> 
+}));
+jest.mock('./components/Jumbotron', () => ({ 
+  Jumbotron: () => <div>Mock Jumbotron</div> 
+}));
+
+// Footer is a default export in my App.js, so this mock is slightly different
+jest.mock('./components/Footer', () => () => <div>Mock Footer</div>);
+
+describe('App Component', () => {
+  
+  test('renders core layout components', () => {
+    render(<App />);
+    
+    // Verify that the persistent UI elements always render
+    expect(screen.getByText('Mock NavigationBar')).toBeInTheDocument();
+    expect(screen.getByText('Mock Jumbotron')).toBeInTheDocument();
+    expect(screen.getByTestId('mock-layout')).toBeInTheDocument();
+    expect(screen.getByText('Mock Footer')).toBeInTheDocument();
+  });
+
+  test('renders the Home component on the default route ("/")', () => {
+    render(<App />);
+    
+    // Because App.js uses BrowserRouter, it will default to the '/' path in a basic test environment
+    expect(screen.getByText('Mock Home')).toBeInTheDocument();
+    
+    // Ensure other routes are NOT rendering at the same time (testing the Switch)
+    expect(screen.queryByText('Mock Resume')).not.toBeInTheDocument();
+    expect(screen.queryByText('Mock NoMatch')).not.toBeInTheDocument();
+  });
 });