From 84e3042cc4567968c1b50337344d4e5693cb7112 Mon Sep 17 00:00:00 2001
From: James Harker <james.harker@hotmail.co.uk>
Date: Wed, 16 Oct 2024 11:11:45 +0100
Subject: [PATCH] added tests for pages

---
 frontend/src/pages/InGame.jsx          |  2 +-
 frontend/src/pages/Lobby.jsx           |  2 +-
 frontend/src/pages/RoundEnd.jsx        |  9 +++++----
 frontend/tests/pages/HomePage.test.jsx |  4 +---
 frontend/tests/pages/InGame.test.jsx   | 16 +++++++++++++++-
 frontend/tests/pages/Lobby.test.jsx    | 17 ++++++++++++++++-
 frontend/tests/pages/RoundEnd.test.jsx | 16 +++++++++++++++-
 7 files changed, 54 insertions(+), 12 deletions(-)

diff --git a/frontend/src/pages/InGame.jsx b/frontend/src/pages/InGame.jsx
index cac7121..05844fe 100644
--- a/frontend/src/pages/InGame.jsx
+++ b/frontend/src/pages/InGame.jsx
@@ -21,7 +21,7 @@ export function InGame() {
           <div className="guess"> 
             <h1>Guess a number component placeholder</h1>
             <form>
-                <label htmlFor="number_guess">Guess a number between 1 and 100!</label>
+                <label htmlFor="number_guess" data-testId="guess-label">Guess a number between 1 and 100!</label>
                 <input type="number" id="number_guess" name="number_guess"></input>
             </form>
           </div>
diff --git a/frontend/src/pages/Lobby.jsx b/frontend/src/pages/Lobby.jsx
index 5a84172..48cc69c 100644
--- a/frontend/src/pages/Lobby.jsx
+++ b/frontend/src/pages/Lobby.jsx
@@ -24,7 +24,7 @@ export function Lobby() {
 
         <div className="share_link">
             <h1>Share link component placeholder</h1>
-            <p>
+            <p data-testid="add-players-prompt">
                 Add up to 6 players using this link
             </p>
             <a> Link</a>
diff --git a/frontend/src/pages/RoundEnd.jsx b/frontend/src/pages/RoundEnd.jsx
index 98c8b06..e0a7798 100644
--- a/frontend/src/pages/RoundEnd.jsx
+++ b/frontend/src/pages/RoundEnd.jsx
@@ -11,16 +11,17 @@ export function RoundEnd() {
             <p>
                 Placeholder for the display number to guess component
             </p>
-            <p>
-                The number was: 42
-            </p>
+            <p data-testId="number-reveal">
+                The number was:
+            </p><br></br>
+            <p>42</p> 
         </div>
 
         <div className="winner">
             <p>
                 Placeholder for the winner component
             </p>
-            <p>
+            <p >
                 The winner is... Player3!
             </p>
         </div>
diff --git a/frontend/tests/pages/HomePage.test.jsx b/frontend/tests/pages/HomePage.test.jsx
index 0158a54..c84e9aa 100644
--- a/frontend/tests/pages/HomePage.test.jsx
+++ b/frontend/tests/pages/HomePage.test.jsx
@@ -6,7 +6,6 @@ import { BrowserRouter } from "react-router-dom";
 import { HomePage } from "../../src/pages/HomePage";
 import { describe, expect, test } from "vitest";
 
-
 describe("Homepage tests", ()  => {
     test("name of the game", () => {
         render(
@@ -18,5 +17,4 @@ describe("Homepage tests", ()  => {
         const heading = screen.getByTestId("game-name");
         expect(heading.textContent).toEqual("Guess the number!");
     });
-});
-
+});
\ No newline at end of file
diff --git a/frontend/tests/pages/InGame.test.jsx b/frontend/tests/pages/InGame.test.jsx
index 06d9541..f062d97 100644
--- a/frontend/tests/pages/InGame.test.jsx
+++ b/frontend/tests/pages/InGame.test.jsx
@@ -4,4 +4,18 @@
 //required imports
 import { render, screen } from "@testing-library/react";
 import { BrowserRouter } from "react-router-dom";
-import { InGame } from "../../src/pages/InGame";
\ No newline at end of file
+import { InGame } from "../../src/pages/InGame";
+import { describe, expect, test } from "vitest";
+
+describe("InGame tests", ()  => {
+    test("name of the game", () => {
+        render(
+            <BrowserRouter>
+                <InGame />
+            </BrowserRouter>
+        );       
+        
+        const heading = screen.getByTestId("guess-label");
+        expect(heading.textContent).toEqual("Guess a number between 1 and 100!");
+    });
+});
\ No newline at end of file
diff --git a/frontend/tests/pages/Lobby.test.jsx b/frontend/tests/pages/Lobby.test.jsx
index 0a6f29e..1907927 100644
--- a/frontend/tests/pages/Lobby.test.jsx
+++ b/frontend/tests/pages/Lobby.test.jsx
@@ -4,4 +4,19 @@
 //required imports
 import { render, screen } from "@testing-library/react";
 import { BrowserRouter } from "react-router-dom";
-import { Lobby } from "../../src/pages/Lobby";
\ No newline at end of file
+import { Lobby } from "../../src/pages/Lobby";
+import { describe, expect, test } from "vitest";
+
+
+describe("Lobby tests", ()  => {
+    test("name of the game", () => {
+        render(
+            <BrowserRouter>
+                <Lobby />
+            </BrowserRouter>
+        );       
+        
+        const heading = screen.getByTestId("add-players-prompt");
+        expect(heading.textContent).toEqual("Add up to 6 players using this link");
+    });
+});
\ No newline at end of file
diff --git a/frontend/tests/pages/RoundEnd.test.jsx b/frontend/tests/pages/RoundEnd.test.jsx
index ade992d..6185e9b 100644
--- a/frontend/tests/pages/RoundEnd.test.jsx
+++ b/frontend/tests/pages/RoundEnd.test.jsx
@@ -4,4 +4,18 @@
 //required imports
 import { render, screen } from "@testing-library/react";
 import { BrowserRouter } from "react-router-dom";
-import { RoundEnd } from "../../src/pages/RoundEnd";
\ No newline at end of file
+import { RoundEnd } from "../../src/pages/RoundEnd";
+import { describe, expect, test } from "vitest";
+
+describe("Round end tests", ()  => {
+    test("name of the game", () => {
+        render(
+            <BrowserRouter>
+                <RoundEnd />
+            </BrowserRouter>
+        );       
+        
+        const heading = screen.getByTestId("number-reveal");
+        expect(heading.textContent).toEqual("The number was:");
+    });
+});
\ No newline at end of file