diff --git a/ui/src/common/Linkify.js b/ui/src/common/Linkify.js index 65d5c70af89..87947905a09 100644 --- a/ui/src/common/Linkify.js +++ b/ui/src/common/Linkify.js @@ -54,7 +54,10 @@ const Linkify = ({ text, ...rest }) => { // Push remaining text if (text.length > lastIndex) { elements.push( - + ) } diff --git a/ui/src/common/Linkify.test.js b/ui/src/common/Linkify.test.js new file mode 100644 index 00000000000..fd896f7d204 --- /dev/null +++ b/ui/src/common/Linkify.test.js @@ -0,0 +1,34 @@ +import React from 'react' +import { render, screen } from '@testing-library/react' +import '@testing-library/jest-dom/extend-expect' +import Linkify from './Linkify' + +const URL = 'http://www.example.com' + +const expectLink = (url) => { + const linkEl = screen.getByRole('link') + expect(linkEl).not.toBeNull() + expect(linkEl?.href).toBe(url) +} + +describe('', () => { + it('should render link', () => { + render() + expectLink(`${URL}/`) + expect(screen.getByText(URL)).toBeInTheDocument() + }) + + it('should render link and text', () => { + render() + expectLink(`${URL}/`) + expect(screen.getByText(/foo/i)).toBeInTheDocument() + expect(screen.getByText(URL)).toBeInTheDocument() + expect(screen.getByText(/bar/i)).toBeInTheDocument() + }) + + it('should render only text', () => { + render() + expect(screen.queryAllByRole('link')).toHaveLength(0) + expect(screen.getByText(/foo bar/i)).toBeInTheDocument() + }) +})