Merge pull request #4898 from niallmccullagh/master

Fix issue with radar description dialog display
backstage · Mar 16, 2021 · ac08d81 · ac08d81
2 parents 21029b5 + b56815b
commit ac08d81
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 2 deletions.
diff --git a/.changeset/cyan-rings-live.md b/.changeset/cyan-rings-live.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-tech-radar': patch
+---
+
+Fixes issue where radar description dialog is not shown when the entry has an url external to the radar page
diff --git a/plugins/tech-radar/src/components/RadarEntry/RadarEntry.test.tsx b/plugins/tech-radar/src/components/RadarEntry/RadarEntry.test.tsx
@@ -79,4 +79,20 @@ describe('RadarEntry', () => {
     expect(radarDescription).toBeInTheDocument();
     expect(screen.getByText(String(minProps.value))).toBeInTheDocument();
   });
+
+  it('should render blip with url equal to # if description present', () => {
+    const withUrl = {
+      ...optionalProps,
+      url: 'http://backstage.io',
+    };
+    render(
+      <ThemeProvider theme={lightTheme}>
+        <svg>
+          <RadarEntry {...withUrl} />
+        </svg>
+      </ThemeProvider>,
+    );
+
+    expect(screen.getByRole('button')).toHaveAttribute('href', '#');
+  });
 });
diff --git a/plugins/tech-radar/src/components/RadarEntry/RadarEntry.tsx b/plugins/tech-radar/src/components/RadarEntry/RadarEntry.tsx
@@ -111,11 +111,12 @@ const RadarEntry = (props: Props): JSX.Element => {
         />
       )}
       {description ? (
+        // eslint-disable-next-line jsx-a11y/anchor-is-valid
         <a
           className={classes.link}
           onClick={handleClickOpen}
-          href={url ? url : '#'}
           role="button"
+          href="#"
           tabIndex={0}
           onKeyPress={toggle}
         >

diff --git a/plugins/tech-radar/src/sampleData.ts b/plugins/tech-radar/src/sampleData.ts
@@ -72,9 +72,11 @@ entries.push({
       moved: 1,
       ringId: 'use',
       date: new Date('2020-08-06'),
+      description:
+        'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur',
     },
   ],
-  url: '#',
+  url: 'https://webpack.js.org/',
   key: 'webpack',
   id: 'webpack',
   title: 'Webpack',