Add test cases.

Signed-off-by: Aramis Sennyey <sennyeya@amazon.com>

plugins/tech-radar/src/components/RadarGrid/RadarGrid.test.tsx

@@ -44,4 +44,16 @@ describe('RadarGrid', () => {
     expect(rendered.getByTestId('radar-grid-x-line')).toBeInTheDocument();
     expect(rendered.getByTestId('radar-grid-y-line')).toBeInTheDocument();
   });
+
+  it('should have the correct text color', async () => {
+    const rendered = await renderInTestApp(
+      <svg>
+        <RadarGrid {...minProps} />
+      </svg>,
+    );
+
+    expect(rendered.getByTestId('radar-ring-heading')).toHaveStyle({
+      fill: '#93c47d',
+    });
+  });
 });

plugins/tech-radar/src/components/RadarGrid/RadarGrid.tsx

@@ -64,6 +64,7 @@ const RadarGrid = (props: Props) => {
       textAnchor="middle"
       className={classes.text}
       style={{ fill: rings[ringIndex].color }}
+      data-testid="radar-ring-heading"
     >
       {rings[ringIndex].name}
     </text>,

plugins/tech-radar/src/components/RadarLegend/RadarLegend.test.tsx

@@ -56,4 +56,19 @@ describe('RadarLegend', () => {
     expect(rendered.getAllByTestId('radar-quadrant')).toHaveLength(1);
     expect(rendered.getAllByTestId('radar-ring')).toHaveLength(1);
   });
+
+  it('should have the correct ring text color', async () => {
+    const rendered = await renderInTestApp(
+      <svg>
+        <RadarLegend {...minProps} />
+      </svg>,
+    );
+
+    expect(rendered.getByTestId('radar-legend')).toBeInTheDocument();
+
+    const legend = rendered.getByTestId('radar-legend-heading');
+    expect(legend).toHaveStyle({
+      color: '#93c47d',
+    });
+  });
 });

plugins/tech-radar/src/components/RadarLegend/RadarLegendRing.tsx

@@ -37,7 +37,11 @@ export const RadarLegendRing = ({
 }: RadarLegendRingProps) => {
   return (
     <div data-testid="radar-ring" key={ring.id} className={classes.ring}>
-      <h3 className={classes.ringHeading} style={{ color: ring.color }}>
+      <h3
+        className={classes.ringHeading}
+        style={{ color: ring.color }}
+        data-testid="radar-legend-heading"
+      >
         {ring.name}
       </h3>
       {entries.length === 0 ? (