add: tests

tests/AuthProvider.test.js

@@ -0,0 +1,23 @@
+import React from "react";
+import { render, screen } from "@testing-library/react";
+import AuthProvider, { AuthContext } from "../src/AuthProvider";
+import "@testing-library/jest-dom";
+describe("AuthProvider", () => {
+    it("should provide default user and roles as null and empty array", () => {
+        render(
+            <AuthProvider>
+                <AuthContext.Consumer>
+                    {({ user, roles }) => (
+                        <>
+                            <div data-testid="user">{user ? user.name : "null"}</div>
+                            <div data-testid="roles">{roles.length}</div>
+                        </>
+                    )}
+                </AuthContext.Consumer>
+            </AuthProvider>
+        );
+
+        expect(screen.getByTestId("user")).toHaveTextContent("null");
+        expect(screen.getByTestId("roles")).toHaveTextContent("0");
+    });
+});

tests/ConfigProvider.test.js

@@ -0,0 +1,45 @@
+import React from "react";
+import { render, screen, act } from "@testing-library/react";
+import ConfigProvider from "../src/ConfigProvider";
+
+global.fetch = jest.fn(() =>
+    new Promise((resolve) =>
+        setTimeout(() => {
+            resolve({
+                ok: true,
+                json: () =>
+                    Promise.resolve({
+                        BACKEND_HOST: "http://localhost:5000",
+                        FRONTEND_HOST: "http://localhost:3000",
+                    }),
+            });
+        }, 100)
+    )
+);
+
+describe("ConfigProvider", () => {
+    it("should display loading initially", async () => {
+        await act(async () => {
+            render(
+                <ConfigProvider>
+                    <div>Loaded</div>
+                </ConfigProvider>
+            );
+        });
+
+        expect(screen.getByText(/Loading configuration/i)).toBeInTheDocument();
+    });
+
+    it("should display children after loading", async () => {
+        await act(async () => {
+            render(
+                <ConfigProvider>
+                    <div>Loaded</div>
+                </ConfigProvider>
+            );
+        });
+
+        const loadedText = await screen.findByText("Loaded");
+        expect(loadedText).toBeInTheDocument();
+    });
+});

tests/PermissionGuard.test.js

@@ -0,0 +1,31 @@
+import React from "react";
+import PermissionGuard from "../src/components/PermissionGuard";
+import { AuthContext } from "../src/AuthProvider";
+import { render, screen } from "@testing-library/react";
+describe("PermissionGuard", () => {
+    it("should render children for users with required roles", () => {
+        const roles = ["admin"];
+        render(
+            <AuthContext.Provider value={{ roles }}>
+                <PermissionGuard rolesRequired={["admin"]}>
+                    <div data-testid="protected-content">Protected Content</div>
+                </PermissionGuard>
+            </AuthContext.Provider>
+        );
+
+        expect(screen.getByTestId("protected-content")).toBeInTheDocument();
+    });
+
+    it("should not render children for users without required roles", () => {
+        const roles = ["user"];
+        render(
+            <AuthContext.Provider value={{ roles }}>
+                <PermissionGuard rolesRequired={["admin"]}>
+                    <div data-testid="protected-content">Protected Content</div>
+                </PermissionGuard>
+            </AuthContext.Provider>
+        );
+
+        expect(screen.queryByTestId("protected-content")).not.toBeInTheDocument();
+    });
+});