From 9c5121b743fcde1ffb107891ccbd00fc57eeae9d Mon Sep 17 00:00:00 2001
From: RustamRu <kagapov.rustam@gmail.com>
Date: Wed, 12 Mar 2025 01:56:03 +0300
Subject: [PATCH] test: Add comprehensive tests for NotFound page component

- Created unit tests for NotFound page rendering
- Mocked translation hook and Lottie animation component
- Verified page content, title, description, and back button
- Ensured correct routing to home page
---
 src/pages/__tests__/notFound.test.tsx | 63 +++++++++++++++++++++++++++
 1 file changed, 63 insertions(+)
 create mode 100644 src/pages/__tests__/notFound.test.tsx

diff --git a/src/pages/__tests__/notFound.test.tsx b/src/pages/__tests__/notFound.test.tsx
new file mode 100644
index 0000000..28cbf2c
--- /dev/null
+++ b/src/pages/__tests__/notFound.test.tsx
@@ -0,0 +1,63 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { BrowserRouter } from 'react-router-dom';
+import { ChakraProvider } from '@chakra-ui/react';
+
+import NotFound from '../notFound/notFound';
+
+// Mock the translation hook
+jest.mock('react-i18next', () => ({
+  useTranslation: () => ({
+    t: (key: string) => {
+      const translations = {
+        'notFound.title': 'Page Not Found',
+        'notFound.description': 'The page you are looking for does not exist',
+        'notFound.button.back': 'Back to Home'
+      };
+      return translations[key] || key;
+    }
+  })
+}));
+
+// Mock the Lottie Player component
+jest.mock('@lottiefiles/react-lottie-player', () => ({
+  Player: () => <div data-testid="lottie-animation">Animation Mock</div>
+}));
+
+describe('NotFound Component', () => {
+  const renderNotFound = () => {
+    return render(
+      <ChakraProvider>
+        <BrowserRouter>
+          <NotFound />
+        </BrowserRouter>
+      </ChakraProvider>
+    );
+  };
+
+  it('renders without crashing', () => {
+    renderNotFound();
+  });
+
+  it('displays the correct content', () => {
+    renderNotFound();
+    
+    // Check if title is present
+    expect(screen.getByText('Page Not Found')).toBeInTheDocument();
+    
+    // Check if description is present
+    expect(screen.getByText('The page you are looking for does not exist')).toBeInTheDocument();
+    
+    // Check if back button is present
+    expect(screen.getByText('Back to Home')).toBeInTheDocument();
+    
+    // Check if Lottie animation is rendered
+    expect(screen.getByTestId('lottie-animation')).toBeInTheDocument();
+  });
+
+  it('contains a link to the dry-wash page', () => {
+    renderNotFound();
+    const backButton = screen.getByText('Back to Home');
+    expect(backButton.closest('a')).toHaveAttribute('href', '/dry-wash');
+  });
+}); 
\ No newline at end of file