From 01c472fbbf18f926d73216c0c4a55e3303f258e2 Mon Sep 17 00:00:00 2001
From: Aman Kumar <akumar30@atlassian.com>
Date: Thu, 28 Mar 2024 23:16:38 +0530
Subject: [PATCH] Write test cases for copy annotation text feature

---
 packages/html-reporter/src/testCaseView.spec.tsx | 6 +++++-
 packages/html-reporter/src/testCaseView.tsx      | 2 +-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/html-reporter/src/testCaseView.spec.tsx b/packages/html-reporter/src/testCaseView.spec.tsx
index 28fe8247f5861..71cb2fc23ac4c 100644
--- a/packages/html-reporter/src/testCaseView.spec.tsx
+++ b/packages/html-reporter/src/testCaseView.spec.tsx
@@ -64,7 +64,11 @@ const testCase: TestCase = {
 
 test('should render test case', async ({ mount }) => {
   const component = await mount(<TestCaseView projectNames={['chromium', 'webkit']} test={testCase} run={0} anchor=''></TestCaseView>);
-  await expect(component.getByText('Annotation text', { exact: false }).first()).toBeVisible();
+  const firstAnnotationElement = component.getByText('Annotation text', { exact: false }).first();
+  await expect(firstAnnotationElement).toBeVisible();
+  await expect(component.getByTestId('annotation-copy-button').first()).not.toBeVisible();
+  await firstAnnotationElement.hover();
+  await expect(component.getByTestId('annotation-copy-button').first()).toBeVisible();
   await component.getByText('Annotations').click();
   await expect(component.getByText('Annotation text')).not.toBeVisible();
   await expect(component.getByText('Outer step')).toBeVisible();
diff --git a/packages/html-reporter/src/testCaseView.tsx b/packages/html-reporter/src/testCaseView.tsx
index 76ff9b3533b17..fc28fb6b6ba00 100644
--- a/packages/html-reporter/src/testCaseView.tsx
+++ b/packages/html-reporter/src/testCaseView.tsx
@@ -78,7 +78,7 @@ function TestCaseAnnotationView({ annotation: { type, description } }: { annotat
     <div className='test-case-annotation'>
       <span style={{ fontWeight: 'bold', display: 'inline-block', marginBlock: '3px' }}>{type}</span>
       {description && <span>: {renderAnnotationDescription(description)}</span>}
-      <span id='annotation-copy-button'>{description && <CopyToClipboard value={description} />}</span>
+      <span id='annotation-copy-button' data-testid='annotation-copy-button' >{description && <CopyToClipboard value={description} />}</span>
     </div>
   );
 }