From 899666da501dfd22267e96be8879dd271b3e4980 Mon Sep 17 00:00:00 2001
From: Joe Banks <joe@jb3.dev>
Date: Wed, 10 Jul 2024 04:17:30 +0100
Subject: Unit tests for Navigation component

---
 src/api/auth.ts                              |  2 +-
 src/tests/pages/FormPage/Navigation.test.tsx | 48 ++++++++++++++++++++++++++++
 2 files changed, 49 insertions(+), 1 deletion(-)
 create mode 100644 src/tests/pages/FormPage/Navigation.test.tsx

diff --git a/src/api/auth.ts b/src/api/auth.ts
index 2dbcdae..3bd3181 100644
--- a/src/api/auth.ts
+++ b/src/api/auth.ts
@@ -23,7 +23,7 @@ interface AuthResult {
 /**
  * Name properties for authorization cookies.
  */
-enum CookieNames {
+export enum CookieNames {
     Scopes = "DiscordOAuthScopes",
     Username = "DiscordUsername"
 }
diff --git a/src/tests/pages/FormPage/Navigation.test.tsx b/src/tests/pages/FormPage/Navigation.test.tsx
new file mode 100644
index 0000000..d4556ab
--- /dev/null
+++ b/src/tests/pages/FormPage/Navigation.test.tsx
@@ -0,0 +1,48 @@
+/** @jsx jsx */
+import Cookies from "universal-cookie";
+import { jsx } from "@emotion/react";
+import { render } from "@testing-library/react";
+import Navigation from "../../../pages/FormPage/Navigation";
+import {MemoryRouter} from "react-router-dom";
+import { OAuthScopes, CookieNames } from "../../../api/auth";
+
+test("navigation shows submit when form is open and no auth required", () => {
+    const { getByRole } = render(<Navigation form_state={true} scopes={[]} />, { wrapper: MemoryRouter });
+    const submitButton = getByRole("button");
+
+    expect(submitButton).not.toBeNull();
+    expect(submitButton.innerHTML).toBe("Submit");
+});
+
+test("submit button does not show submit on a closed form", () => {
+    const { queryByRole } = render(<Navigation form_state={false} scopes={[]} />, { wrapper: MemoryRouter });
+    const submitButton = queryByRole("button");
+
+    expect(submitButton).toBeNull();
+});
+
+test("navigation shows oauth button when form is open and auth is required", () => {
+    const { getByRole } = render(<Navigation form_state={true} scopes={[OAuthScopes.Identify]} />, { wrapper: MemoryRouter });
+    const loginButton = getByRole("button");
+
+    expect(loginButton).not.toBeNull();
+    expect(loginButton.textContent).toBe("Login To Submit");
+});
+
+test("navigation shows submit button when form is open and auth is present", () => {
+    new Cookies().set(CookieNames.Scopes, [OAuthScopes.Identify]);
+    const { getByRole } = render(<Navigation form_state={true} scopes={[OAuthScopes.Identify]} />, { wrapper: MemoryRouter });
+    const loginButton = getByRole("button");
+
+    expect(loginButton).not.toBeNull();
+    expect(loginButton.textContent).toBe("Submit");
+});
+
+test("navigation shows login button when form is open and auth is present but insufficient scopes", () => {
+    new Cookies().set(CookieNames.Scopes, [OAuthScopes.Identify]);
+    const { getByRole } = render(<Navigation form_state={true} scopes={[OAuthScopes.Identify, OAuthScopes.Guilds]} />, { wrapper: MemoryRouter });
+    const loginButton = getByRole("button");
+
+    expect(loginButton).not.toBeNull();
+    expect(loginButton.textContent).toBe("Login To Submit");
+});
-- 
cgit v1.2.3