import { SELECTORS } from "../../fixtures/selectors"; import { expect, test } from "../../fixtures/test"; test.describe("Contact Email Tooltip @smoke", () => { test.beforeEach(async ({ gotoApp, waitForAppReady }) => { await gotoApp(); await waitForAppReady(); }); test("tooltip appears on mouse hover", async ({ page }) => { const contactLink = page.locator(SELECTORS.footer.contactLink); // Check if contact link exists const count = await contactLink.count(); if (count === 0) { test.skip(); return; } // Hover over contact link await contactLink.hover(); await page.waitForTimeout(500); // Tooltip should appear const tooltip = page.locator(SELECTORS.footer.contactHint); await expect(tooltip).toBeVisible(); // Tooltip should have text const tooltipText = await tooltip.textContent(); expect(tooltipText).toBeTruthy(); expect(tooltipText!.length).toBeGreaterThan(0); }); test("tooltip disappears on mouse leave", async ({ page }) => { const contactLink = page.locator(SELECTORS.footer.contactLink); // Check if contact link exists const count = await contactLink.count(); if (count === 0) { test.skip(); return; } // Hover over contact link await contactLink.hover(); await page.waitForTimeout(500); const tooltip = page.locator(SELECTORS.footer.contactHint); await expect(tooltip).toBeVisible(); // Move mouse away await page.mouse.move(0, 0); await page.waitForTimeout(500); // Tooltip should disappear await expect(tooltip).not.toBeVisible(); }); test("tooltip follows mouse movement", async ({ page }) => { const contactLink = page.locator(SELECTORS.footer.contactLink); // Check if contact link exists const count = await contactLink.count(); if (count === 0) { test.skip(); return; } // Hover over contact link await contactLink.hover(); await page.waitForTimeout(500); const tooltip = page.locator(SELECTORS.footer.contactHint); await expect(tooltip).toBeVisible(); // Get initial position const initialBox = await tooltip.boundingBox(); // Move mouse slightly const linkBox = await contactLink.boundingBox(); await page.mouse.move( linkBox!.x + linkBox!.width / 2 + 20, linkBox!.y + linkBox!.height / 2, ); await page.waitForTimeout(200); // Tooltip should still be visible await expect(tooltip).toBeVisible(); }); test("tooltip appears on keyboard focus", async ({ page }) => { const contactLink = page.locator(SELECTORS.footer.contactLink); // Check if contact link exists const count = await contactLink.count(); if (count === 0) { test.skip(); return; } // Focus contact link await contactLink.focus(); await page.waitForTimeout(500); // Tooltip should appear const tooltip = page.locator(SELECTORS.footer.contactHint); await expect(tooltip).toBeVisible(); }); test("tooltip disappears on keyboard blur", async ({ page }) => { const contactLink = page.locator(SELECTORS.footer.contactLink); // Check if contact link exists const count = await contactLink.count(); if (count === 0) { test.skip(); return; } // Focus contact link await contactLink.focus(); await page.waitForTimeout(500); const tooltip = page.locator(SELECTORS.footer.contactHint); await expect(tooltip).toBeVisible(); // Blur contact link await page.evaluate(() => (document.activeElement as HTMLElement)?.blur()); await page.waitForTimeout(500); // Tooltip should disappear await expect(tooltip).not.toBeVisible(); }); test("tooltip content is safe and appropriate", async ({ page }) => { const contactLink = page.locator(SELECTORS.footer.contactLink); // Check if contact link exists const count = await contactLink.count(); if (count === 0) { test.skip(); return; } // Hover to show tooltip await contactLink.hover(); await page.waitForTimeout(500); const tooltip = page.locator(SELECTORS.footer.contactHint); const tooltipText = await tooltip.textContent(); // Should not contain inappropriate content const inappropriateWords = [ "profanity", "offensive", "racist", "sexist", "misogynistic", ]; for (const word of inappropriateWords) { expect(tooltipText?.toLowerCase()).not.toContain(word); } // Should contain helpful text expect(tooltipText).toBeTruthy(); expect(tooltipText!.length).toBeGreaterThan(5); }); test("tooltip does not trap focus", async ({ page }) => { const contactLink = page.locator(SELECTORS.footer.contactLink); // Check if contact link exists const count = await contactLink.count(); if (count === 0) { test.skip(); return; } // Focus contact link await contactLink.focus(); await page.waitForTimeout(500); // Tooltip should be visible const tooltip = page.locator(SELECTORS.footer.contactHint); await expect(tooltip).toBeVisible(); // Tab away await page.keyboard.press("Tab"); await page.waitForTimeout(500); // Tooltip should disappear await expect(tooltip).not.toBeVisible(); // Focus should have moved const isStillFocused = await contactLink.isFocused(); expect(isStillFocused).toBe(false); }); });