diff --git a/public/app/core/components/EmptyListCTA/EmptyListCTA.test.tsx b/public/app/core/components/EmptyListCTA/EmptyListCTA.test.tsx new file mode 100644 index 00000000000..35d720e70cf --- /dev/null +++ b/public/app/core/components/EmptyListCTA/EmptyListCTA.test.tsx @@ -0,0 +1,18 @@ +import { render, screen } from '@testing-library/react'; +import React from 'react'; + +import EmptyListCTA from './EmptyListCTA'; + +describe('EmptyListCTA', () => { + it('should return a button element if there is no buttonLink prop', () => { + render(); + + expect(screen.getByRole('button', { name: 'button title' })); + }); + + it('should return an anchor element if there is a buttonLink prop', () => { + render(); + + expect(screen.getByRole('link', { name: 'button title' })); + }); +}); diff --git a/public/app/core/components/EmptyListCTA/EmptyListCTA.tsx b/public/app/core/components/EmptyListCTA/EmptyListCTA.tsx index a8c7220fcee..9dd81f6c69d 100644 --- a/public/app/core/components/EmptyListCTA/EmptyListCTA.tsx +++ b/public/app/core/components/EmptyListCTA/EmptyListCTA.tsx @@ -1,7 +1,7 @@ -import React, { MouseEvent } from 'react'; import { css } from '@emotion/css'; -import { CallToActionCard, Icon, IconName, LinkButton } from '@grafana/ui'; import { selectors } from '@grafana/e2e-selectors'; +import { Button, CallToActionCard, Icon, IconName, LinkButton } from '@grafana/ui'; +import React, { MouseEvent } from 'react'; export interface Props { title: string; @@ -75,8 +75,9 @@ const EmptyListCTA: React.FunctionComponent = ({ ` : ''; + const ButtonEl = buttonLink ? LinkButton : Button; const ctaElement = ( - = ({ disabled={buttonDisabled} > {buttonTitle} - + ); return ;