From 39d5c81fa335a89fc8bd99d76d10d166ed266af9 Mon Sep 17 00:00:00 2001
From: osohyun0224 <53892427+osohyun0224@users.noreply.github.com>
Date: Sat, 25 May 2024 16:07:52 +0900
Subject: [PATCH] feat(reporting): Add hyperlink rendering for URL fields in
 HTML reports

---
 packages/html-reporter/src/testCaseView.tsx | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/html-reporter/src/testCaseView.tsx b/packages/html-reporter/src/testCaseView.tsx
index eecbdac9f5..a038f44785 100644
--- a/packages/html-reporter/src/testCaseView.tsx
+++ b/packages/html-reporter/src/testCaseView.tsx
@@ -72,11 +72,21 @@ function renderAnnotationDescription(description: string) {
   return description;
 }
 
-function TestCaseAnnotationView({ annotation: { type, description } }: { annotation: TestCaseAnnotation }) {
+function renderAnnotationLink(url: string) {
+  try {
+    if (['http:', 'https:'].includes(new URL(url).protocol)) {
+      return <a href={url} target='_blank' rel='noopener noreferrer'>{url}</a>;
+    }
+  } catch {}
+  return url;
+}
+
+function TestCaseAnnotationView({ annotation: { type, description, url } }: { annotation: TestCaseAnnotation }) {
   return (
     <div className='test-case-annotation'>
       <span style={{ fontWeight: 'bold' }}>{type}</span>
       {description && <span>: {renderAnnotationDescription(description)}</span>}
+      {url && <span>: {renderAnnotationLink(url)}</span>}
     </div>
   );
 }