From 55c84bd5a97f8cb6d073eea2429cbe4d9fa99fed Mon Sep 17 00:00:00 2001
From: The Joel <jotelfootball@gmail.com>
Date: Sun, 28 Jun 2026 14:38:09 +0100
Subject: [PATCH] test: add integration test for 404 page rendering on unknown
 routes

---
 src/App.tsx                                   | 19 +++++----------
 .../NotFoundPage.integration.test.tsx         | 24 +++++++++++++++++++
 src/routes.tsx                                | 13 ++++++++++
 3 files changed, 43 insertions(+), 13 deletions(-)
 create mode 100644 src/pages/__tests__/NotFoundPage.integration.test.tsx
 create mode 100644 src/routes.tsx

diff --git a/src/App.tsx b/src/App.tsx
index 599195e..3a1f313 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,23 +2,16 @@ import Lenis from 'lenis';
 import { useEffect } from 'react';
 import { Toaster } from 'react-hot-toast';
 import { createBrowserRouter, RouterProvider } from 'react-router';
-import HomePage from './pages/HomePage';
-import NotFoundPage from './pages/NotFoundPage';
+import { routes } from './routes';
 
-const router = createBrowserRouter([
-	{
-		path: '/',
-		element: <HomePage />,
-	},
-	{
-		path: '*',
-		element: <NotFoundPage />,
-	},
-]);
+const router = createBrowserRouter(routes);
 
 function App() {
 	useEffect(() => {
-		const lenis = new Lenis({ duration: 1.2, easing: t => Math.min(1, 1.001 - Math.pow(2, -10 * t)) });
+		const lenis = new Lenis({
+			duration: 1.2,
+			easing: t => Math.min(1, 1.001 - Math.pow(2, -10 * t)),
+		});
 		function raf(time: number) {
 			lenis.raf(time);
 			requestAnimationFrame(raf);
diff --git a/src/pages/__tests__/NotFoundPage.integration.test.tsx b/src/pages/__tests__/NotFoundPage.integration.test.tsx
new file mode 100644
index 0000000..62a93a4
--- /dev/null
+++ b/src/pages/__tests__/NotFoundPage.integration.test.tsx
@@ -0,0 +1,24 @@
+import { render, screen } from '@testing-library/react';
+import { createMemoryRouter, RouterProvider } from 'react-router';
+import { describe, expect, it } from 'vitest';
+import { routes } from '@/routes';
+
+describe('NotFoundPage Integration', () => {
+	it('renders NotFoundPage when navigating to an unknown route', () => {
+		const router = createMemoryRouter(routes, {
+			initialEntries: ['/unknown-path-xyz'],
+		});
+
+		render(<RouterProvider router={router} />);
+
+		// Assert the NotFoundPage content is rendered
+		expect(
+			screen.getByRole('heading', {
+				name: /this marketplace path is not live yet/i,
+			})
+		).toBeInTheDocument();
+
+		// Assert the page title or heading contains a 404 or not found message
+		expect(screen.getByText(/route not found/i)).toBeInTheDocument();
+	});
+});
diff --git a/src/routes.tsx b/src/routes.tsx
new file mode 100644
index 0000000..af7577b
--- /dev/null
+++ b/src/routes.tsx
@@ -0,0 +1,13 @@
+import HomePage from './pages/HomePage';
+import NotFoundPage from './pages/NotFoundPage';
+
+export const routes = [
+	{
+		path: '/',
+		element: <HomePage />,
+	},
+	{
+		path: '*',
+		element: <NotFoundPage />,
+	},
+];