diff --git a/packages/html-reporter/src/testCaseView.css b/packages/html-reporter/src/testCaseView.css
index d87cf3aacb..90e2f4057b 100644
--- a/packages/html-reporter/src/testCaseView.css
+++ b/packages/html-reporter/src/testCaseView.css
@@ -47,6 +47,7 @@
   flex: none;
   align-items: center;
   padding: 0 8px 8px;
+  line-height: 24px;
 }
 
 .test-case-path {
diff --git a/packages/html-reporter/src/testCaseView.tsx b/packages/html-reporter/src/testCaseView.tsx
index 1fe4f42ed3..e3656bf414 100644
--- a/packages/html-reporter/src/testCaseView.tsx
+++ b/packages/html-reporter/src/testCaseView.tsx
@@ -50,7 +50,11 @@ export const TestCaseView: React.FC<{
     {test && <div className='test-case-path'>{test.path.join(' › ')}</div>}
     {test && <div className='test-case-title'>{test?.title}</div>}
     {test && <div className='hbox'>
-      <div className='test-case-location'>{test.location.file}:{test.location.line}</div>
+      <div className='test-case-location'>
+        <CopyToClipboardContainer value={`${test?.location.file}:${test?.location.line}`}>
+          {test.location.file}:{test.location.line}
+        </CopyToClipboardContainer>
+      </div>
       <div style={{ flex: 'auto' }}></div>
       <div className='test-case-duration'>{msToString(test.duration)}</div>
     </div>}