From 73a352e10a3698acbbf1f51fc969051e607e0995 Mon Sep 17 00:00:00 2001
From: Jack Palmer <jackpalmer@spotify.com>
Date: Tue, 6 Dec 2022 09:20:24 +0000
Subject: [PATCH] chore: Add tests for InfoCard subheading

Signed-off-by: Jack Palmer <jackpalmer@spotify.com>
---
 .../src/layout/InfoCard/InfoCard.test.tsx     | 35 +++++++++++++++++++
 .../src/layout/InfoCard/InfoCard.tsx          |  5 ++-
 2 files changed, 39 insertions(+), 1 deletion(-)

diff --git a/packages/core-components/src/layout/InfoCard/InfoCard.test.tsx b/packages/core-components/src/layout/InfoCard/InfoCard.test.tsx
index 479efe4fd4..0db7c24c96 100644
--- a/packages/core-components/src/layout/InfoCard/InfoCard.test.tsx
+++ b/packages/core-components/src/layout/InfoCard/InfoCard.test.tsx
@@ -16,6 +16,7 @@
 
 import React from 'react';
 import { renderInTestApp } from '@backstage/test-utils';
+import { within } from '@testing-library/react';
 import { InfoCard } from './InfoCard';
 
 const minProps = {
@@ -36,4 +37,38 @@ describe('<InfoCard />', () => {
     const rendered = await renderInTestApp(<InfoCard {...minProps} />);
     expect(rendered.getByText('A deepLink title')).toBeInTheDocument();
   });
+
+  describe('Subheader', () => {
+    it('shows the subheader passed in via the subheader prop', async () => {
+      const { getByTestId } = await renderInTestApp(
+        <InfoCard {...minProps} subheader="example subheader" />,
+      );
+
+      const subheaderContainer = getByTestId('info-card-subheader');
+
+      expect(
+        within(subheaderContainer).getByText('example subheader'),
+      ).toBeInTheDocument();
+    });
+
+    it('shows the icon passed in via the icon prop', async () => {
+      const { getByTestId } = await renderInTestApp(
+        <InfoCard {...minProps} icon={<span data-testid="mock-icon" />} />,
+      );
+
+      const subheaderContainer = getByTestId('info-card-subheader');
+
+      expect(
+        within(subheaderContainer).getByTestId('mock-icon'),
+      ).toBeInTheDocument();
+    });
+
+    it('is not rendered where there is not an icon or subheading', async () => {
+      const { queryByTestId } = await renderInTestApp(
+        <InfoCard {...minProps} />,
+      );
+
+      expect(queryByTestId('info-card-subheader')).not.toBeInTheDocument();
+    });
+  });
 });
diff --git a/packages/core-components/src/layout/InfoCard/InfoCard.tsx b/packages/core-components/src/layout/InfoCard/InfoCard.tsx
index cafd65de28..95d474aae4 100644
--- a/packages/core-components/src/layout/InfoCard/InfoCard.tsx
+++ b/packages/core-components/src/layout/InfoCard/InfoCard.tsx
@@ -205,7 +205,10 @@ export function InfoCard(props: Props): JSX.Element {
     }
 
     return (
-      <div className={classes.headerSubheader}>
+      <div
+        className={classes.headerSubheader}
+        data-testid="info-card-subheader"
+      >
         {subheader && <div className={classes.subheader}>{subheader}</div>}
         {icon}
       </div>