Tests added for components I worked on

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);
+    });
+  });
+});

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>

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);
+
+
+  });
+});

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>
     </>
   );