Merge pull request #70 from dusek2/indexTest

Adding more unit tests index.js, skeleton.js

app/src/components/NavigationPanel.js

@@ -5,7 +5,7 @@ import styles from "./NavigationPanel.module.css";
 
 const NavigationPanel = () => {
   return (
-    <div className={styles.navigationpanel}>
+    <div className={styles.navigationpanel} data-testid="navigation-panel">
       <Settings />
       <Quests />
       <Game />

app/src/index.js

@@ -9,6 +9,6 @@ const root = createRoot(container);
 
 root.render(
   <BrowserRouter>
-    <App />
+    <App data-testid="app-root" />
   </BrowserRouter>
 );

app/src/tests/BackButton.test.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import BackButton from '../components/BackButton';
 import '@testing-library/jest-dom/extend-expect';
 
-
 describe('BackButton', () => {
   it('renders without crashing', () => {
     render(<BackButton backButtonPosition="fixed" />);
@@ -27,4 +27,24 @@ describe('BackButton', () => {
     expect(iconElement).toHaveAttribute('src', '/group.svg');
     expect(iconElement).toHaveClass('groupIcon');
   });
+
+  it('navigates to the correct location when clicked', () => {
+    const { container } = render(<BackButton backButtonPosition="fixed" />);
+    const buttonElement = screen.getByRole('button');
+    expect(buttonElement).toBeInTheDocument();
+
+    // Mock window.location.href setter
+    const originalLocation = window.location.href;
+    delete window.location;
+    window.location = { href: '' };
+
+    // Click the button
+    buttonElement.click();
+
+    // Assert window.location.href is updated
+    expect(window.location.href).toBe('/home');
+
+    // Restore original window.location
+    window.location = originalLocation;
+  });
 });

app/src/tests/Skeleton.test.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import Skeleton from '../pages/skeleton/Skeleton';
+import '@testing-library/jest-dom/extend-expect';
+
+
+// Mocking useFontSize hook
+jest.mock('../contexts/FontSizeContext', () => ({
+  useFontSize: () => ({
+    fontSize: 16, // Sample font size
+    darkMode: false, // Sample dark mode value
+  }),
+}));
+
+describe('Skeleton Component', () => {
+  test('renders skeleton route', () => {
+    render(<Skeleton />);
+    const skeletonRoute = screen.getByTestId('skeleton-route');
+    expect(skeletonRoute).toBeInTheDocument();
+  });
+
+  test('renders navigation panel', () => {
+    render(<Skeleton />);
+    const navigationPanel = screen.getByTestId('navigation-panel');
+    expect(navigationPanel).toBeInTheDocument();
+  });
+
+  test('renders frame', () => {
+    render(<Skeleton />);
+    const frame = screen.getByTestId('top-panel');
+    expect(frame).toBeInTheDocument();
+  });
+
+  test('renders page content', () => {
+    render(<Skeleton />);
+    const pageContent = screen.getByTestId('page-content');
+    expect(pageContent).toBeInTheDocument();
+  });
+});

app/src/tests/index.test.js

@@ -0,0 +1,44 @@
+import { createRoot } from "react-dom/client";
+import { BrowserRouter } from "react-router-dom";
+import App from "../App";
+import "../global.css";
+
+// Mock createRoot function
+jest.mock("react-dom/client", () => ({
+  createRoot: jest.fn(),
+}));
+
+describe("index.js", () => {
+  let mockRender;
+
+  beforeEach(() => {
+    // Mock render function
+    mockRender = jest.fn();
+
+    // Mock createRoot implementation
+    createRoot.mockReturnValue({
+      render: mockRender,
+    });
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  test("sets up the root element and renders App within BrowserRouter", () => {
+    // Require index.js to execute the setup
+    require("../index");
+
+    // Verify createRoot is called with the root container
+    expect(createRoot).toHaveBeenCalledTimes(1);
+    expect(createRoot).toHaveBeenCalledWith(document.getElementById("root"));
+
+    // Verify App component is rendered within BrowserRouter
+    expect(mockRender).toHaveBeenCalledTimes(1);
+    expect(mockRender.mock.calls[0][0]).toEqual(
+      <BrowserRouter>
+        <App data-testid="app-root" />
+      </BrowserRouter>
+    );
+  });
+});