From c8383692b94b55b09f90218de06cfc66c74c98e5 Mon Sep 17 00:00:00 2001
From: James Parslow <james.parslow@sage.com>
Date: Wed, 11 Dec 2024 17:23:10 +0000
Subject: [PATCH] test(portrait): address missing jest test coverage

---
 src/components/portrait/portrait.test.tsx | 43 +++++++++++++----------
 1 file changed, 25 insertions(+), 18 deletions(-)

diff --git a/src/components/portrait/portrait.test.tsx b/src/components/portrait/portrait.test.tsx
index 57c0d3c49f..f2d07b55c9 100644
--- a/src/components/portrait/portrait.test.tsx
+++ b/src/components/portrait/portrait.test.tsx
@@ -46,6 +46,14 @@ test("renders with a gravatar image, if a valid email is passed via the `gravata
   expect(img).toHaveAttribute("src", src);
 });
 
+test("renders a decorative image, when gravatar prop is provided but alt is not", () => {
+  const email = "chris.barber@sage.com";
+  render(<Portrait gravatar={email} />);
+
+  const decorativeImg = screen.getByAltText("");
+  expect(decorativeImg).toBeVisible();
+});
+
 test("logs a deprecation warning once when the `gravatar` prop is passed, and a gravatar loads", () => {
   const loggerSpy = jest
     .spyOn(Logger, "deprecate")
@@ -89,24 +97,31 @@ test("if a valid gravatar email is not found and an onError event is triggered,
   );
 });
 
-test("renders with a custom image, if a valid src is passed via the `src` prop", () => {
+test("renders a custom image with the correct src and alt attributes", () => {
   const src = "https://upload.wikimedia.org/wikipedia/en/6/6c/Heatposter.jpg";
-  render(<Portrait src={src} alt="foo" />);
+  render(<Portrait src={src} alt="Movie poster of Heat" />);
 
-  const img = screen.getByRole("img");
-  expect(img).toBeVisible();
-  expect(img).toHaveAttribute("src", src);
+  const image = screen.getByAltText("Movie poster of Heat");
+  expect(image).toHaveAttribute("src", src);
+});
+
+test("renders a decorative image, when src prop is provided but alt is not", () => {
+  const src = "https://upload.wikimedia.org/wikipedia/en/6/6c/Heatposter.jpg";
+  render(<Portrait src={src} />);
+
+  const decorativeImg = screen.getByAltText("");
+  expect(decorativeImg).toBeVisible();
 });
 
 test("if a valid src is not found and an onError event is triggered, the default individual icon is rendered", async () => {
   const src = "not-a-url";
-  render(<Portrait src={src} alt="foo" />);
+  render(<Portrait src={src} alt="foobar" />);
 
-  const img = screen.getByRole("img");
-  expect(img).toBeVisible();
-  expect(img).toHaveAttribute("src", src);
+  const image = screen.getByAltText("foobar");
+  expect(image).toBeVisible();
+  expect(image).toHaveAttribute("src", src);
 
-  fireEvent.error(img);
+  fireEvent.error(image);
 
   await waitFor(() => expect(screen.getByTestId("icon")).toBeVisible());
   await waitFor(() =>
@@ -127,14 +142,6 @@ test("when both the `gravatar` and `src` props are passed simultaneously, an inv
   consoleSpy.mockRestore();
 });
 
-test("allows the alt attribute to be set, via the `alt` prop", () => {
-  const src = "https://upload.wikimedia.org/wikipedia/en/6/6c/Heatposter.jpg";
-  render(<Portrait src={src} alt="custom-alt" />);
-
-  const alt = screen.getByAltText("custom-alt");
-  expect(alt).toBeVisible();
-});
-
 test("renders with a square shape, if the `shape` prop is value is `square`", () => {
   render(<Portrait data-role="portrait" shape="square" />);