Adding some more tests to components that use svgs

NYPL · Dec 5, 2024 · 7bcd230 · 7bcd230
1 parent c7249f4
commit 7bcd230
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 0 deletions.
diff --git a/src/components/Banner/Banner.test.tsx b/src/components/Banner/Banner.test.tsx
@@ -77,6 +77,11 @@ describe("Banner", () => {
     // by its "img" role.
     const icon = screen.getByTestId("bannerID-banner-icon");
     expect(icon).toBeInTheDocument();
+
+    expect(screen.getByTitle("Banner neutral icon")).toHaveAttribute(
+      "data-file-name",
+      "SvgErrorOutline"
+    );
   });
 
   it("renders a custom Icon component", () => {
@@ -100,6 +105,11 @@ describe("Banner", () => {
 
     const customIcon = screen.getByTestId("custom-icon");
     expect(customIcon).toBeInTheDocument();
+
+    expect(screen.getByTitle("check icon")).toHaveAttribute(
+      "data-file-name",
+      "SvgCheck"
+    );
   });
 
   it("renders with an aria-label attribute", () => {
@@ -121,6 +131,10 @@ describe("Banner", () => {
 
     expect(screen.getByTestId("bannerID-dismissible-icon")).toBeInTheDocument();
     expect(screen.getByTitle("Banner close icon")).toBeInTheDocument();
+    expect(screen.getByTitle("Banner close icon")).toHaveAttribute(
+      "data-file-name",
+      "SvgClose"
+    );
   });
 
   it("renders the informative Banner type", () => {

diff --git a/src/components/SocialMediaLinks/SocialMediaLinks.test.tsx b/src/components/SocialMediaLinks/SocialMediaLinks.test.tsx
@@ -137,6 +137,16 @@ describe("SocialMediaLinks", () => {
     // The icons should appear.
     expect(screen.getByTitle("NYPL Facebook")).toBeInTheDocument();
     expect(screen.getByTitle("Alt Twitter")).toBeInTheDocument();
+
+    // The icon mocks should transform the correct icon file.
+    expect(screen.getByTitle("NYPL Facebook")).toHaveAttribute(
+      "data-file-name",
+      "SvgSocialFacebook"
+    );
+    expect(screen.getByTitle("Alt Twitter")).toHaveAttribute(
+      "data-file-name",
+      "SvgSocialTwitter"
+    );
   });
 });