Add tests for Button and ButtonLink components

A new test file, Button.component.test.tsx, has been added for the Button component to validate if it renders a button and correctly displays the provided children as text. Tests in ButtonLink.component.test.tsx have been reorganized for clarity. The tests now more clearly verify rendering of a link and the display of children as text in the ButtonLink component.

frontend/src/components/Button/Button.component.test.tsx

@@ -0,0 +1,23 @@
+import { render, screen } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import Button from "./Button.tsx";
+
+test("Button component renders a button", () => {
+  render(
+    <Button buttonType="delete" handleOnClick={() => {}}>
+      Delete
+    </Button>
+  );
+  const button = screen.getByRole("button");
+  expect(button).toBeInTheDocument();
+});
+
+test("Button component renders children as text", () => {
+  render(
+    <Button buttonType="delete" handleOnClick={() => {}}>
+      Delete
+    </Button>
+  );
+  const text = screen.getByText(/delete/i);
+  expect(text).toBeInTheDocument();
+});

frontend/src/components/ButtonLink/ButtonLink.component.test.tsx

@@ -3,32 +3,32 @@ import "@testing-library/jest-dom";
 import ButtonLink from "./ButtonLink.tsx";
 import { MemoryRouter } from "react-router-dom";
 
-test("ButtonLink component displays children as text", () => {
+test("ButtonLink component renders a link", () => {
   render(
     <MemoryRouter>
       <ButtonLink href="/my-url">Click here</ButtonLink>
     </MemoryRouter>
   );
-  const text = screen.getByText(/click here/i);
-  expect(text).toBeInTheDocument();
+  const button = screen.getByRole("link");
+  expect(button).toBeInTheDocument();
 });
 
-test("ButtonLink component displays a link", () => {
+test("ButtonLink component links to the correct target", () => {
   render(
     <MemoryRouter>
       <ButtonLink href="/my-url">Click here</ButtonLink>
     </MemoryRouter>
   );
   const button = screen.getByRole("link");
-  expect(button).toBeInTheDocument();
+  expect(button).toHaveAttribute("href", "/my-url");
 });
 
-test("ButtonLink component links to the correct target", () => {
+test("ButtonLink component renders children as text", () => {
   render(
     <MemoryRouter>
       <ButtonLink href="/my-url">Click here</ButtonLink>
     </MemoryRouter>
   );
-  const button = screen.getByRole("link");
-  expect(button).toHaveAttribute("href", "/my-url");
+  const text = screen.getByText(/click here/i);
+  expect(text).toBeInTheDocument();
 });