From 418e49c036ba83d53203c17dc471494ce5f315d5 Mon Sep 17 00:00:00 2001
From: Zachary Williams <zachjw34@gmail.com>
Date: Mon, 6 Feb 2023 15:00:46 -0600
Subject: [PATCH 1/3] misc: debug page tooltip distance and artifact border

---
 packages/app/src/debug/DebugArtifactLink.vue | 4 +++-
 packages/app/src/debug/DebugFailedTest.vue   | 2 +-
 packages/app/src/debug/DebugSpec.vue         | 5 +++--
 3 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/packages/app/src/debug/DebugArtifactLink.vue b/packages/app/src/debug/DebugArtifactLink.vue
index 635705840128..b1fa3cc31160 100644
--- a/packages/app/src/debug/DebugArtifactLink.vue
+++ b/packages/app/src/debug/DebugArtifactLink.vue
@@ -2,9 +2,10 @@
   <Tooltip
     placement="bottom"
     :data-cy="`artifact-for-${icon}`"
+    :distance="8"
   >
     <ExternalLink
-      class="flex h-full w-full items-center justify-center"
+      class="flex h-24px w-24px justify-center items-center hocus:rounded-md group hocus:border-1px hocus:border-indigo-500"
       :data-cy="`${icon}-button`"
       :href="props.url || '#'"
       :use-default-hocus="true"
@@ -16,6 +17,7 @@
         fill-color="gray-100"
         hocus-stroke-color="indigo-500"
         hocus-fill-color="indigo-100"
+        interactive-colors-on-group
       />
     </ExternalLink>
     <template #popper>
diff --git a/packages/app/src/debug/DebugFailedTest.vue b/packages/app/src/debug/DebugFailedTest.vue
index cb4d741b2157..e08e23f1af05 100644
--- a/packages/app/src/debug/DebugFailedTest.vue
+++ b/packages/app/src/debug/DebugFailedTest.vue
@@ -48,7 +48,7 @@
     <div
       v-if="!props.expandable"
       data-cy="debug-artifacts"
-      class="flex flex-grow space-x-4.5 opacity-0 px-18px justify-end test-row-artifacts"
+      class="flex flex-grow opacity-0 px-18px gap-16px justify-end test-row-artifacts"
     >
       <div
         v-for="result, i in failedTestData.debugArtifacts"
diff --git a/packages/app/src/debug/DebugSpec.vue b/packages/app/src/debug/DebugSpec.vue
index e18b299596bd..72f9bbe4abd4 100644
--- a/packages/app/src/debug/DebugSpec.vue
+++ b/packages/app/src/debug/DebugSpec.vue
@@ -142,6 +142,7 @@
             color="dark"
             :is-interactive="!!(runAllFailuresState.cta)"
             :disabled="!runAllFailuresState.disabled"
+            :distance="8"
           >
             <Button
               data-cy="run-failures"
@@ -186,9 +187,9 @@
       <div
         v-for="thumbprint in Object.keys(specData.failedTests)"
         :key="`test-${thumbprint}`"
-        :data-cy="`test-group`"
+        data-cy="test-group"
         class="flex flex-col flex-start border-b-gray-100 border-b-1px w-full pr-16px pl-16px justify-center"
-        :class="Object.keys(specData.groups).length > 1 ? 'pb-16px': 'hover:bg-gray-50'"
+        :class="Object.keys(specData.groups).length > 1 ? 'pb-16px': 'hover:bg-gray-50 focus-within:bg-gray-50'"
       >
         <DebugFailedTest
           v-if="specData.failedTests[thumbprint].length >= 1"

From d1dbcb9425d40768ab1d37710011a06f52a5e4ed Mon Sep 17 00:00:00 2001
From: Zachary Williams <zachjw34@gmail.com>
Date: Mon, 6 Feb 2023 15:21:57 -0600
Subject: [PATCH 2/3] add changelog entry

---
 cli/CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/cli/CHANGELOG.md b/cli/CHANGELOG.md
index a8b434ff6c69..2930a7a8f4cd 100644
--- a/cli/CHANGELOG.md
+++ b/cli/CHANGELOG.md
@@ -11,6 +11,7 @@ _Released 02/14/2023 (PENDING)_
 
 - Improved the layout of the Debug Page on smaller viewports when there is a pending run. Addresses [#25664](https://github.com/cypress-io/cypress/issues/25664).
 - Icons in Debug page will no longer shrink at small viewports. Addresses [#25665](https://github.com/cypress-io/cypress/issues/25665).
+- Increased the spacing between elements and their associated tooltip and added borders around artifact links on the Debug Page. Addresses [#25666](https://github.com/cypress-io/cypress/issues/25666).
 
 ## 12.5.1
 

From 74744b45579b9b8363b4016f8309a82d359c7c9a Mon Sep 17 00:00:00 2001
From: Zachary Williams <zachjw34@gmail.com>
Date: Tue, 7 Feb 2023 09:17:26 -0600
Subject: [PATCH 3/3] fix CT test

---
 packages/app/src/debug/DebugArtifactLink.cy.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/app/src/debug/DebugArtifactLink.cy.tsx b/packages/app/src/debug/DebugArtifactLink.cy.tsx
index 919abc703d88..196da01d36ce 100644
--- a/packages/app/src/debug/DebugArtifactLink.cy.tsx
+++ b/packages/app/src/debug/DebugArtifactLink.cy.tsx
@@ -11,7 +11,7 @@ describe('<DebugArtifacts />', () => {
   it('mounts correctly, provides expected tooltip content, and emits correct event', () => {
     artifactMapping.forEach((artifact) => {
       cy.mount(() => (
-        <DebugArtifactLink icon={artifact.icon} popperText={artifact.text} url={artifact.url}/>
+        <DebugArtifactLink class="m-24px inline-flex" icon={artifact.icon} popperText={artifact.text} url={artifact.url}/>
       ))
 
       cy.findByTestId(`artifact-for-${artifact.icon}`).should('have.length', 1)