From 15db565d1b8bca3537feede64c338c017bc03e88 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bogusz=20Micha=C5=82owski?= Date: Thu, 20 Nov 2025 21:46:16 +0100 Subject: [PATCH 1/4] fix(tooltip): set initial position for follow mouse mode --- src/components/Tooltip/Tooltip.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/src/components/Tooltip/Tooltip.tsx b/src/components/Tooltip/Tooltip.tsx index 6deef5981..1dd95acd3 100644 --- a/src/components/Tooltip/Tooltip.tsx +++ b/src/components/Tooltip/Tooltip.tsx @@ -307,6 +307,18 @@ const Tooltip = ({ openPortal(); }; + const handleFocus = () => { + if (followMouse) { + if (wrapperRef.current) { + // set initial position for the tooltip + setPositionStyle( + getPositionStyle(adjustedPosition, wrapperRef.current) + ); + } + } + openPortal(); +} + const delayedOpenPortal: MouseEventHandler = useCallback(() => { if (isOpen) { return; @@ -325,7 +337,7 @@ const Tooltip = ({ className={className} onBlur={handleBlur} onClick={handleClick} - onFocus={openPortal} + onFocus={handleFocus} onMouseOut={handleBlur} onMouseOver={delayedOpenPortal} > From e95d0a2d6027d22b3a8467691f082f67c41274c5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bogusz=20Micha=C5=82owski?= Date: Thu, 20 Nov 2025 22:35:07 +0100 Subject: [PATCH 2/4] fix(tooltip): listen to mousemove event also for closed tooltip --- src/components/Tooltip/Tooltip.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Tooltip/Tooltip.tsx b/src/components/Tooltip/Tooltip.tsx index 1dd95acd3..4bfcb68c0 100644 --- a/src/components/Tooltip/Tooltip.tsx +++ b/src/components/Tooltip/Tooltip.tsx @@ -253,7 +253,7 @@ const Tooltip = ({ mouseHandler, "mousemove", true, - followMouse && isOpen, + followMouse, ); // Handle adjusting the position of the tooltip so that it remains on screen. From c53412b4168605d2b426648de84b383f4dd5a890 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bogusz=20Micha=C5=82owski?= Date: Fri, 21 Nov 2025 09:08:30 +0100 Subject: [PATCH 3/4] test(tooltip): add visibility tests for followMouse case --- src/components/Tooltip/Tooltip.test.tsx | 24 ++++++++++++++++++++---- 1 file changed, 20 insertions(+), 4 deletions(-) diff --git a/src/components/Tooltip/Tooltip.test.tsx b/src/components/Tooltip/Tooltip.test.tsx index 71cd59602..f8d13ce11 100644 --- a/src/components/Tooltip/Tooltip.test.tsx +++ b/src/components/Tooltip/Tooltip.test.tsx @@ -165,9 +165,9 @@ describe("Tooltip", () => { expect(screen.queryByTestId("tooltip-portal")).not.toBeInTheDocument(); }); - it("renders tooltip message on focus", async () => { + it("shows tooltip message on focus", async () => { render( - + , ); @@ -177,8 +177,24 @@ describe("Tooltip", () => { await act(async () => { await userEventWithTimers.tab(); }); - expect(screen.getByTestId("tooltip-portal")).toBeInTheDocument(); - expect(screen.getByText("tooltip text")).toBeInTheDocument(); + expect(screen.getByTestId("tooltip-portal")).toBeVisible(); + expect(screen.getByText("tooltip text")).toBeVisible(); + }); + + it("shows tooltip message on focus, with followMouse active", async () => { + render( + + + , + ); + + expect(screen.queryByTestId("tooltip-portal")).not.toBeInTheDocument(); + expect(screen.queryByText("tooltip text")).not.toBeInTheDocument(); + await act(async () => { + await userEventWithTimers.tab(); + }); + expect(screen.getByTestId("tooltip-portal")).toBeVisible(); + expect(screen.getByText("tooltip text")).toBeVisible(); }); it("updates the tooltip to fit on the screen", async () => { From ba362c183f0ce92f0518d44a3ba20832b5b9e17e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bogusz=20Micha=C5=82owski?= Date: Fri, 21 Nov 2025 11:00:05 +0100 Subject: [PATCH 4/4] test(tooltip): remove unnecessary followMouse flag from test --- src/components/Tooltip/Tooltip.test.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Tooltip/Tooltip.test.tsx b/src/components/Tooltip/Tooltip.test.tsx index f8d13ce11..a2a1dd4a1 100644 --- a/src/components/Tooltip/Tooltip.test.tsx +++ b/src/components/Tooltip/Tooltip.test.tsx @@ -167,7 +167,7 @@ describe("Tooltip", () => { it("shows tooltip message on focus", async () => { render( - + , );