From 62e7492357de411d72a6fe931e5c557dd0bfb78a Mon Sep 17 00:00:00 2001
From: Deluan <deluan@navidrome.org>
Date: Fri, 7 Oct 2022 17:44:16 -0400
Subject: [PATCH] Add Linkify test

---
 ui/src/common/Linkify.js      |  5 ++++-
 ui/src/common/Linkify.test.js | 34 ++++++++++++++++++++++++++++++++++
 2 files changed, 38 insertions(+), 1 deletion(-)
 create mode 100644 ui/src/common/Linkify.test.js

diff --git a/ui/src/common/Linkify.js b/ui/src/common/Linkify.js
index 65d5c70a..87947905 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(
-        <span dangerouslySetInnerHTML={{ __html: text.substring(lastIndex) }} />
+        <span
+          key={'last-span-key'}
+          dangerouslySetInnerHTML={{ __html: text.substring(lastIndex) }}
+        />
       )
     }
 
diff --git a/ui/src/common/Linkify.test.js b/ui/src/common/Linkify.test.js
new file mode 100644
index 00000000..fd896f7d
--- /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('<Linkify />', () => {
+  it('should render link', () => {
+    render(<Linkify text={URL} />)
+    expectLink(`${URL}/`)
+    expect(screen.getByText(URL)).toBeInTheDocument()
+  })
+
+  it('should render link and text', () => {
+    render(<Linkify text={`foo ${URL} bar`} />)
+    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(<Linkify text={'foo bar'} />)
+    expect(screen.queryAllByRole('link')).toHaveLength(0)
+    expect(screen.getByText(/foo bar/i)).toBeInTheDocument()
+  })
+})