From 23fe8521357bd84870901dce2c2b5fa80e582382 Mon Sep 17 00:00:00 2001
From: Nathaniel Caza <mastercactapus@gmail.com>
Date: Thu, 25 Apr 2024 10:28:26 -0500
Subject: [PATCH] playwright: Fix tooltip hover check (#3824)

* remove redundant shift creation

* add testid to all variants
---
 test/integration/schedules.spec.ts          | 27 +--------------------
 web/src/app/schedules/ScheduleShiftList.tsx | 24 +++++++++---------
 2 files changed, 13 insertions(+), 38 deletions(-)

diff --git a/test/integration/schedules.spec.ts b/test/integration/schedules.spec.ts
index 4a1533c3ab..76b3e16e30 100644
--- a/test/integration/schedules.spec.ts
+++ b/test/integration/schedules.spec.ts
@@ -28,7 +28,7 @@ test.afterEach(async ({ page }) => {
   await page.click('button:has-text("Confirm")')
 })
 
-test('local time hover', async ({ page, isMobile }) => {
+test('local time hover', async ({ page }) => {
   // change schedule tz to Europe/Amsterdam
   await page.click('[aria-label="Edit"]')
   await page.fill('input[name=time-zone]', 'Europe/Amsterdam')
@@ -37,31 +37,6 @@ test('local time hover', async ({ page, isMobile }) => {
 
   await page.goto(`${baseURL}/schedules/${scheduleID}/shifts`)
 
-  // add user override
-  if (!isMobile) {
-    await page.click('button:has-text("Create Override")')
-    await page.keyboard.press('Tab')
-    await page.keyboard.press('ArrowDown')
-    await page.keyboard.press('ArrowDown')
-    await page.keyboard.press('Enter')
-  } else {
-    await page.click('[data-testid="AddIcon"]')
-    await page.keyboard.press('Tab')
-    await page.keyboard.press('Tab')
-    await page.keyboard.press('ArrowDown')
-    await page.keyboard.press('ArrowDown')
-    await page.keyboard.press('Enter')
-  }
-
-  // should display schedule timezone in form
-  await expect(page.locator('form[id=dialog-form]')).toContainText(
-    'Times shown in schedule timezone (Europe/Amsterdam)',
-  )
-  await page.locator('input[name=addUserID]').fill('Admin McIntegrationFace')
-
-  await page.click('li:has-text("Admin McIntegrationFace")')
-  await page.locator('button[type=submit]').click()
-
   // should display schedule tz on hover
   await page.hover(`[data-testid="shift-details"]`)
   await expect(page.locator('[data-testid="shift-tooltip"]')).toContainText(
diff --git a/web/src/app/schedules/ScheduleShiftList.tsx b/web/src/app/schedules/ScheduleShiftList.tsx
index 16e77936a8..0386d71c05 100644
--- a/web/src/app/schedules/ScheduleShiftList.tsx
+++ b/web/src/app/schedules/ScheduleShiftList.tsx
@@ -178,10 +178,11 @@ function ScheduleShiftList({
       const scheduleTZDetails = `From ${schedStartTime} to ${schedEndTime} ${tzAbbr}`
       const localTZDetails = `From ${localStartTime} to ${localEndTime} ${localTzAbbr}`
       return (
-        <Tooltip title={scheduleTZDetails} placement='right'>
-          <span data-cy='shift-details' data-testid='shift-details'>
-            {localTZDetails}
-          </span>
+        <Tooltip
+          title={<span data-testid='shift-tooltip'>{scheduleTZDetails}</span>}
+          placement='right'
+        >
+          <span data-testid='shift-details'>{localTZDetails}</span>
         </Tooltip>
       )
     }
@@ -194,8 +195,11 @@ function ScheduleShiftList({
         s.truncated ? ' at least' : ''
       } ${localEndTime} ${localTzAbbr}`
       return (
-        <Tooltip title={scheduleTZDetails} placement='right'>
-          <span>{localTZDetails}</span>
+        <Tooltip
+          title={<span data-testid='shift-tooltip'>{scheduleTZDetails}</span>}
+          placement='right'
+        >
+          <span data-testid='shift-details'>{localTZDetails}</span>
         </Tooltip>
       )
     }
@@ -205,14 +209,10 @@ function ScheduleShiftList({
     const localTZDetails = `Active after ${localStartTime} ${localTzAbbr}`
     return (
       <Tooltip
-        title={scheduleTZDetails}
+        title={<span data-testid='shift-tooltip'>{scheduleTZDetails}</span>}
         placement='right'
-        PopperProps={{
-          // @ts-expect-error test id
-          'data-testid': 'shift-tooltip',
-        }}
       >
-        <span>{localTZDetails}</span>
+        <span data-testid='shift-details'>{localTZDetails}</span>
       </Tooltip>
     )
   }