From 9111e021e6fdf07059e837fb6c103c86fd63f368 Mon Sep 17 00:00:00 2001
From: areebsattar <areebsattar1@gmail.com>
Date: Thu, 7 Mar 2024 23:31:50 +0000
Subject: [PATCH] Tests added for components I worked on

---
 src/components/Footer/Footer.test.jsx         | 25 ++++++++++++++++
 src/components/SearchResult/SearchResult.jsx  | 26 ++++++++---------
 .../SearchResult/SearchResult.test.jsx        | 29 +++++++++++++++++++
 src/components/SearchResult/TableHead.jsx     |  2 +-
 4 files changed, 67 insertions(+), 15 deletions(-)
 create mode 100644 src/components/Footer/Footer.test.jsx
 create mode 100644 src/components/SearchResult/SearchResult.test.jsx

diff --git a/src/components/Footer/Footer.test.jsx b/src/components/Footer/Footer.test.jsx
new file mode 100644
index 0000000..8533cd6
--- /dev/null
+++ b/src/components/Footer/Footer.test.jsx
@@ -0,0 +1,25 @@
+import Footer from "./Footer.jsx";
+import { describe, it, expect } from "vitest";
+import { render, screen } from "@testing-library/react";
+
+describe("Footer", () => {
+  it("renders the footer at the bottom of the page with each address property as a list item", () => {
+    const details = [
+      "123 Fake Street, London, E1 4UD",
+      "hello@fakehotel.com",
+      "0123 456789",
+    ];
+
+    render(<Footer details={details} />);
+
+    const footer = screen.getByRole("contentinfo");
+    const listItems = screen.getAllByRole("listitem");
+
+    expect(footer).toBeTruthy();
+    expect(listItems).toHaveLength(details.length);
+
+    details.forEach((detail, index) => {
+      expect(listItems[index]).toHaveTextContent(detail);
+    });
+  });
+});
diff --git a/src/components/SearchResult/SearchResult.jsx b/src/components/SearchResult/SearchResult.jsx
index 825e1d3..e73ffb9 100644
--- a/src/components/SearchResult/SearchResult.jsx
+++ b/src/components/SearchResult/SearchResult.jsx
@@ -18,20 +18,18 @@ function SearchResult() {
             "day"
           );
           return (
-            <>
-              <TableBody
-                key={book.id}
-                id={book.id}
-                title={book.title}
-                firstName={book.firstName}
-                surName={book.surname}
-                email={book.email}
-                roomId={book.roomId}
-                checkInDate={book.checkInDate}
-                checkOutDate={book.checkOutDate}
-                stayNights={stayNightsTotal}
-              />
-            </>
+            <TableBody
+              key={book.id}
+              id={book.id}
+              title={book.title}
+              firstName={book.firstName}
+              surName={book.surname}
+              email={book.email}
+              roomId={book.roomId}
+              checkInDate={book.checkInDate}
+              checkOutDate={book.checkOutDate}
+              stayNights={stayNightsTotal}
+            />
           );
         })}
       </tbody>
diff --git a/src/components/SearchResult/SearchResult.test.jsx b/src/components/SearchResult/SearchResult.test.jsx
new file mode 100644
index 0000000..a698be6
--- /dev/null
+++ b/src/components/SearchResult/SearchResult.test.jsx
@@ -0,0 +1,29 @@
+import SearchResult from "./SearchResult";
+import { describe, it, expect } from "vitest";
+import { render, screen } from "@testing-library/react";
+
+describe("Table", () => {
+  it("renders a column for each booking attribute in the table header", () => {
+    render(<SearchResult />);
+
+    const tableHead = screen.getByRole("table");
+    const tableHeaders = screen.getAllByRole("columnheader");
+
+    expect(tableHead).toBeTruthy();
+    expect(tableHeaders).toHaveLength(9);
+
+    
+  });
+
+  it("renders more than one booking in the table body", () => {
+    render(<SearchResult />);
+
+    const tableBody = screen.getByRole("table");
+    const tableRows = screen.getAllByRole("row");
+
+    expect(tableBody).toBeTruthy();
+    expect(tableRows.length).toBeGreaterThan(1);
+    
+
+  });
+});
diff --git a/src/components/SearchResult/TableHead.jsx b/src/components/SearchResult/TableHead.jsx
index 9afda64..f91815d 100644
--- a/src/components/SearchResult/TableHead.jsx
+++ b/src/components/SearchResult/TableHead.jsx
@@ -10,7 +10,7 @@ function TableHead() {
         <th>Room id</th>
         <th>Check in date</th>
         <th>Check out date</th>
-        <th>Total Nights to Stay</th>
+        <th>Number of Nights</th>
       </tr>
     </>
   );