diff --git a/packages/app/src/hooks/use-hover-safe-zone.test.tsx b/packages/app/src/hooks/use-hover-safe-zone.test.tsx index cd5860327..616e9fd80 100644 --- a/packages/app/src/hooks/use-hover-safe-zone.test.tsx +++ b/packages/app/src/hooks/use-hover-safe-zone.test.tsx @@ -111,13 +111,29 @@ describe("useHoverSafeZone", () => { }); act(() => pointerMove(110, 40)); + expect(onEnterSafeZone).toHaveBeenCalledTimes(1); expect(onLeaveSafeZone).not.toHaveBeenCalled(); act(() => pointerMove(300, 40)); expect(onLeaveSafeZone).toHaveBeenCalledTimes(1); act(() => pointerMove(130, 40)); - expect(onEnterSafeZone).toHaveBeenCalledTimes(1); + expect(onEnterSafeZone).toHaveBeenCalledTimes(2); + }); + + it("refreshes the safe-zone enter callback while moving inside", () => { + const onEnterSafeZone = vi.fn(); + const onLeaveSafeZone = vi.fn(); + + act(() => { + root?.render(); + }); + + act(() => pointerMove(110, 40)); + act(() => pointerMove(130, 40)); + + expect(onEnterSafeZone).toHaveBeenCalledTimes(2); + expect(onLeaveSafeZone).not.toHaveBeenCalled(); }); it("treats leaving the browser window as leaving the safe zone", () => { diff --git a/packages/app/src/hooks/use-hover-safe-zone.ts b/packages/app/src/hooks/use-hover-safe-zone.ts index 70c00e042..4f4d1cb6f 100644 --- a/packages/app/src/hooks/use-hover-safe-zone.ts +++ b/packages/app/src/hooks/use-hover-safe-zone.ts @@ -54,8 +54,15 @@ export function useHoverSafeZone({ const contentRect = contentNode ? contentNode.getBoundingClientRect() : null; const inside = isInsideSafeZone(triggerRect, contentRect, event.clientX, event.clientY); - if (inside) enterSafeZone(); - else leaveSafeZone(); + if (inside) { + if (wasInside) { + onEnterSafeZone(); + return; + } + enterSafeZone(); + return; + } + leaveSafeZone(); } function handlePointerOut(event: PointerEvent) {