@primitiv-ui/react 0.1.29 → 0.1.30

package/src/Tooltip/__tests__/Tooltip.error-handling.test.tsx

@@ -0,0 +1,37 @@
+import { render } from "@testing-library/react";
+
+import { Tooltip } from "../Tooltip";
+
+describe("Tooltip error handling", () => {
+  beforeEach(() => {
+    vi.spyOn(console, "error").mockImplementation(() => {});
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("throws when Tooltip.Root is used outside Tooltip.Provider", () => {
+    expect(() =>
+      render(
+        <Tooltip.Root>
+          <Tooltip.Trigger>Orphan</Tooltip.Trigger>
+        </Tooltip.Root>,
+      ),
+    ).toThrowError(
+      "Tooltip sub-components must be rendered inside a <Tooltip.Provider>.",
+    );
+  });
+
+  it("throws when Tooltip.Trigger is used outside Tooltip.Root", () => {
+    expect(() =>
+      render(
+        <Tooltip.Provider>
+          <Tooltip.Trigger>Orphan</Tooltip.Trigger>
+        </Tooltip.Provider>,
+      ),
+    ).toThrowError(
+      "Tooltip sub-components must be rendered inside a <Tooltip.Root>.",
+    );
+  });
+});

package/src/Tooltip/__tests__/Tooltip.escape-hatches.test.tsx

@@ -70,4 +70,77 @@ describe("Tooltip — escape hatches", () => {
 
     expect(screen.getByRole("tooltip")).toBeInTheDocument();
   });
+
+  it("does not respond to an outside pointer-down while closed, even when Content is forceMounted", async () => {
+    const user = userEvent.setup();
+    const onPointerDownOutside = vi.fn();
+
+    render(
+      <div>
+        <Tooltip.Provider>
+          <Tooltip.Root>
+            <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+            <Tooltip.Content
+              forceMount
+              onPointerDownOutside={onPointerDownOutside}
+            >
+              Tooltip text
+            </Tooltip.Content>
+          </Tooltip.Root>
+        </Tooltip.Provider>
+        <button>Outside</button>
+      </div>,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Outside" }));
+
+    expect(onPointerDownOutside).not.toHaveBeenCalled();
+  });
+
+  it("removes its document pointerdown listener on unmount", () => {
+    const addEventListener = vi.spyOn(document, "addEventListener");
+    const removeEventListener = vi.spyOn(document, "removeEventListener");
+
+    const { unmount } = render(
+      <Tooltip.Provider>
+        <Tooltip.Root defaultOpen>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+    const handler = addEventListener.mock.calls.find(
+      ([type]) => type === "pointerdown",
+    )?.[1];
+    unmount();
+
+    expect(handler).toBeTypeOf("function");
+    expect(removeEventListener).toHaveBeenCalledWith("pointerdown", handler);
+
+    addEventListener.mockRestore();
+    removeEventListener.mockRestore();
+  });
+
+  it("closes on an outside pointer-down after opening via hover (the listener effect must re-run once open flips)", async () => {
+    const user = userEvent.setup();
+
+    render(
+      <div>
+        <Tooltip.Provider delayDuration={0}>
+          <Tooltip.Root>
+            <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+            <Tooltip.Content>Tooltip text</Tooltip.Content>
+          </Tooltip.Root>
+        </Tooltip.Provider>
+        <button>Outside</button>
+      </div>,
+    );
+
+    await user.hover(screen.getByRole("button", { name: "Hover me" }));
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+
+    await user.click(screen.getByRole("button", { name: "Outside" }));
+
+    expect(screen.queryByRole("tooltip")).toBeNull();
+  });
 });

package/src/Tooltip/__tests__/Tooltip.keyboard-interaction.test.tsx

@@ -82,4 +82,138 @@ describe("Tooltip — keyboard interaction", () => {
     await user.keyboard("{Escape}");
     expect(screen.queryByRole("tooltip")).toBeNull();
   });
+
+  it("ignores keys other than Escape pressed while the tooltip is open", async () => {
+    const user = userEvent.setup();
+    const onEscapeKeyDown = vi.fn();
+
+    render(
+      <Tooltip.Provider delayDuration={0}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content onEscapeKeyDown={onEscapeKeyDown}>
+            Tooltip text
+          </Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    await user.hover(screen.getByRole("button", { name: "Hover me" }));
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+
+    await user.keyboard("{Enter}");
+
+    expect(onEscapeKeyDown).not.toHaveBeenCalled();
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+  });
+
+  it("does not respond to Escape while closed, even when Content is forceMounted", async () => {
+    const user = userEvent.setup();
+    const onEscapeKeyDown = vi.fn();
+
+    render(
+      <Tooltip.Provider>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content forceMount onEscapeKeyDown={onEscapeKeyDown}>
+            Tooltip text
+          </Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    await user.keyboard("{Escape}");
+
+    expect(onEscapeKeyDown).not.toHaveBeenCalled();
+  });
+
+  it("removes its document Escape listener on unmount", () => {
+    const addEventListener = vi.spyOn(document, "addEventListener");
+    const removeEventListener = vi.spyOn(document, "removeEventListener");
+
+    const { unmount } = render(
+      <Tooltip.Provider>
+        <Tooltip.Root defaultOpen>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+    const handler = addEventListener.mock.calls.find(
+      ([type]) => type === "keydown",
+    )?.[1];
+    unmount();
+
+    expect(handler).toBeTypeOf("function");
+    expect(removeEventListener).toHaveBeenCalledWith("keydown", handler);
+
+    addEventListener.mockRestore();
+    removeEventListener.mockRestore();
+  });
+
+  it("responds to Escape after opening via hover (the listener effect must re-run once open flips)", async () => {
+    const user = userEvent.setup();
+
+    render(
+      <Tooltip.Provider delayDuration={0}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    await user.hover(screen.getByRole("button", { name: "Hover me" }));
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+
+    await user.keyboard("{Escape}");
+
+    expect(screen.queryByRole("tooltip")).toBeNull();
+  });
+
+  it("closes via the trigger's own Escape handler even when no Tooltip.Content is rendered", async () => {
+    const user = userEvent.setup();
+
+    render(
+      <Tooltip.Provider>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Focusable</Tooltip.Trigger>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    await user.tab();
+    expect(
+      screen.getByRole("button", { name: "Focusable" }),
+    ).toHaveAttribute("data-state", "open");
+
+    await user.keyboard("{Escape}");
+
+    expect(
+      screen.getByRole("button", { name: "Focusable" }),
+    ).toHaveAttribute("data-state", "closed");
+  });
+
+  it("ignores non-Escape keys on the trigger when no Tooltip.Content is rendered", async () => {
+    const user = userEvent.setup();
+
+    render(
+      <Tooltip.Provider>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Focusable</Tooltip.Trigger>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    await user.tab();
+    expect(
+      screen.getByRole("button", { name: "Focusable" }),
+    ).toHaveAttribute("data-state", "open");
+
+    await user.keyboard("{Enter}");
+
+    expect(
+      screen.getByRole("button", { name: "Focusable" }),
+    ).toHaveAttribute("data-state", "open");
+  });
 });

package/src/Tooltip/__tests__/Tooltip.skip-delay.test.tsx

@@ -0,0 +1,216 @@
+import { act, fireEvent, render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+import { Tooltip } from "../Tooltip";
+
+// The skip-delay duration is a deliberately odd number, not a round 5000. These
+// tests identify "the skip-delay timer" by the delay passed to setTimeout, and
+// 5000 is common enough that other machinery in the environment schedules one too
+// — which silently made a foreign timer look like ours. That is the most likely
+// root cause of this file being flaky in CI while passing locally: the assertion
+// pinned whichever 5000ms timer happened to be scheduled first.
+const SKIP_DELAY = 4321;
+
+describe("Tooltip.Provider — skip-delay coordination", () => {
+  it("skips the delay for a tooltip while another is already open, even with a long base delay", async () => {
+    const user = userEvent.setup();
+
+    render(
+      <Tooltip.Provider delayDuration={100000} skipDelayDuration={SKIP_DELAY}>
+        <Tooltip.Root delayDuration={0}>
+          <Tooltip.Trigger>First</Tooltip.Trigger>
+          <Tooltip.Content>First tip</Tooltip.Content>
+        </Tooltip.Root>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Second</Tooltip.Trigger>
+          <Tooltip.Content>Second tip</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    await user.hover(screen.getByRole("button", { name: "First" }));
+    expect(screen.getByText("First tip")).toBeInTheDocument();
+
+    await user.hover(screen.getByRole("button", { name: "Second" }));
+
+    expect(screen.getByText("Second tip")).toBeInTheDocument();
+  });
+
+  it("clears a pending skip-delay timer when a tooltip opens again within the skip window", async () => {
+    const user = userEvent.setup();
+    const clearTimeoutSpy = vi.spyOn(globalThis, "clearTimeout");
+    const setTimeoutSpy = vi.spyOn(globalThis, "setTimeout");
+
+    render(
+      <Tooltip.Provider delayDuration={0} skipDelayDuration={SKIP_DELAY}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+        <button>Other</button>
+      </Tooltip.Provider>,
+    );
+
+    await user.tab();
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+    await user.tab();
+    expect(screen.queryByRole("tooltip")).toBeNull();
+
+    const skipTimerCallIndex = setTimeoutSpy.mock.calls.findIndex(
+      ([, delay]) => delay === SKIP_DELAY,
+    );
+    const timerId = setTimeoutSpy.mock.results[skipTimerCallIndex].value;
+
+    await user.hover(screen.getByRole("button", { name: "Hover me" }));
+
+    expect(clearTimeoutSpy).toHaveBeenCalledWith(timerId);
+
+    clearTimeoutSpy.mockRestore();
+    setTimeoutSpy.mockRestore();
+  });
+
+  it("does not orphan a skip-delay timer when two closes land in a row", () => {
+    const clearTimeoutSpy = vi.spyOn(globalThis, "clearTimeout");
+    const setTimeoutSpy = vi.spyOn(globalThis, "setTimeout");
+
+    render(
+      <Tooltip.Provider delayDuration={0} skipDelayDuration={SKIP_DELAY}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+        <button>Other</button>
+      </Tooltip.Provider>,
+    );
+
+    // `closeImmediate` is deliberately unguarded — it calls `onCloseGlobally()`
+    // whether or not the tooltip is open — so two close-triggering events in a row
+    // schedule two skip-delay timers. Escape and blur are both wired straight to
+    // it; pointer-leave is not (it routes through `closeWithGrace`, which is why an
+    // earlier version of this test using unhover only ever produced one timer).
+    //
+    // Driven with `fireEvent`, not `userEvent`: this asserts an exact timer count,
+    // so it must not depend on how a higher-level helper chooses to synthesise
+    // focus and key events — which is precisely the kind of environment
+    // sensitivity that made this file flaky.
+    const trigger = screen.getByRole("button", { name: "Hover me" });
+    fireEvent.focus(trigger);
+    fireEvent.keyDown(trigger, { key: "Escape" }); // → close #1
+    fireEvent.blur(trigger); // → close #2
+
+    const skipTimers = setTimeoutSpy.mock.calls
+      .map((call, i) => ({ delay: call[1], id: setTimeoutSpy.mock.results[i].value }))
+      .filter(({ delay }) => delay === SKIP_DELAY)
+      .map(({ id }) => id);
+
+    // At least two timers, asserted rather than assumed: with fewer than two the
+    // loop below would pass vacuously and quietly stop testing anything. NOT an
+    // exact count — an earlier version demanded exactly two and measured three,
+    // because how many close events a given engine and testing helper synthesise
+    // is not the property under test. The invariant is what matters, and it holds
+    // for any number of closes.
+    expect(skipTimers.length).toBeGreaterThanOrEqual(2);
+    // Every timer but the newest must have been cancelled. Without that the ref
+    // only ever tracks the latest, so the earlier one survives, fires unobserved,
+    // and can no longer be cancelled by a later open.
+    for (const orphan of skipTimers.slice(0, -1)) {
+      expect(clearTimeoutSpy).toHaveBeenCalledWith(orphan);
+    }
+
+    clearTimeoutSpy.mockRestore();
+    setTimeoutSpy.mockRestore();
+  });
+
+  it("schedules the skip-delay timer using the Provider's skipDelayDuration when a tooltip closes", async () => {
+    const user = userEvent.setup();
+    const setTimeoutSpy = vi.spyOn(globalThis, "setTimeout");
+
+    render(
+      <Tooltip.Provider skipDelayDuration={1234}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Focusable</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+        <button>Other</button>
+      </Tooltip.Provider>,
+    );
+
+    await user.tab();
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+    await user.tab();
+
+    expect(setTimeoutSpy).toHaveBeenCalledWith(expect.any(Function), 1234);
+
+    setTimeoutSpy.mockRestore();
+  });
+
+  it("uses the current skipDelayDuration for the skip-delay timer after the Provider prop changes", async () => {
+    const user = userEvent.setup();
+    const setTimeoutSpy = vi.spyOn(globalThis, "setTimeout");
+
+    function Wrapper({ skipDelayDuration }: { skipDelayDuration: number }) {
+      return (
+        <Tooltip.Provider skipDelayDuration={skipDelayDuration}>
+          <Tooltip.Root>
+            <Tooltip.Trigger>Focusable</Tooltip.Trigger>
+            <Tooltip.Content>Tooltip text</Tooltip.Content>
+          </Tooltip.Root>
+          <button>Other</button>
+        </Tooltip.Provider>
+      );
+    }
+
+    const { rerender } = render(<Wrapper skipDelayDuration={1000} />);
+    rerender(<Wrapper skipDelayDuration={42} />);
+
+    await user.tab();
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+    await user.tab();
+
+    expect(setTimeoutSpy).toHaveBeenCalledWith(expect.any(Function), 42);
+
+    setTimeoutSpy.mockRestore();
+  });
+
+  describe("once the skip-delay window has actually elapsed", () => {
+    beforeEach(() => {
+      vi.useFakeTimers();
+    });
+
+    afterEach(() => {
+      vi.useRealTimers();
+    });
+
+    it("re-applies the full base delay to the next tooltip instead of skipping it", () => {
+      render(
+        <Tooltip.Provider delayDuration={1000} skipDelayDuration={100}>
+          <Tooltip.Root delayDuration={0} disableHoverableContent>
+            <Tooltip.Trigger>First</Tooltip.Trigger>
+            <Tooltip.Content>First tip</Tooltip.Content>
+          </Tooltip.Root>
+          <Tooltip.Root>
+            <Tooltip.Trigger>Second</Tooltip.Trigger>
+            <Tooltip.Content>Second tip</Tooltip.Content>
+          </Tooltip.Root>
+        </Tooltip.Provider>,
+      );
+
+      fireEvent.pointerEnter(screen.getByRole("button", { name: "First" }));
+      expect(screen.getByText("First tip")).toBeInTheDocument();
+
+      fireEvent.pointerLeave(screen.getByRole("button", { name: "First" }));
+
+      act(() => {
+        vi.advanceTimersByTime(100);
+      });
+
+      fireEvent.pointerEnter(screen.getByRole("button", { name: "Second" }));
+      expect(screen.queryByText("Second tip")).toBeNull();
+
+      act(() => {
+        vi.advanceTimersByTime(1000);
+      });
+      expect(screen.getByText("Second tip")).toBeInTheDocument();
+    });
+  });
+});

package/src/Tooltip/__tests__/Tooltip.timer-coordination.test.tsx

@@ -0,0 +1,223 @@
+import { act, fireEvent, render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+import { Tooltip } from "../Tooltip";
+
+describe("Tooltip.Root — timer callbacks stay current across re-renders", () => {
+  it("uses the current onOpenChange for both a focus-open and a blur-close after the Provider re-renders", async () => {
+    const user = userEvent.setup();
+    const firstOnOpenChange = vi.fn();
+    const secondOnOpenChange = vi.fn();
+
+    function Wrapper({
+      onOpenChange,
+    }: {
+      onOpenChange: (open: boolean) => void;
+    }) {
+      return (
+        <Tooltip.Provider>
+          <Tooltip.Root onOpenChange={onOpenChange}>
+            <Tooltip.Trigger>Focusable</Tooltip.Trigger>
+            <Tooltip.Content>Tooltip text</Tooltip.Content>
+          </Tooltip.Root>
+          <button>Other</button>
+        </Tooltip.Provider>
+      );
+    }
+
+    const { rerender } = render(<Wrapper onOpenChange={firstOnOpenChange} />);
+    rerender(<Wrapper onOpenChange={secondOnOpenChange} />);
+
+    await user.tab();
+    await user.tab();
+
+    expect(firstOnOpenChange).not.toHaveBeenCalled();
+    expect(secondOnOpenChange).toHaveBeenCalledWith(true);
+    expect(secondOnOpenChange).toHaveBeenCalledWith(false);
+  });
+});
+
+describe("Tooltip.Root — timer coordination (fake timers)", () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it("opens synchronously when the effective delay is 0, not via a scheduled timer", () => {
+    render(
+      <Tooltip.Provider delayDuration={0}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    fireEvent.pointerEnter(screen.getByRole("button", { name: "Hover me" }));
+
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+  });
+
+  it("cancels a pending hover-delay open timer when the trigger is focused before it elapses", () => {
+    const onOpenChange = vi.fn();
+
+    render(
+      <Tooltip.Provider delayDuration={1000}>
+        <Tooltip.Root onOpenChange={onOpenChange}>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    fireEvent.pointerEnter(screen.getByRole("button", { name: "Hover me" }));
+    fireEvent.focus(screen.getByRole("button", { name: "Hover me" }));
+
+    expect(onOpenChange).toHaveBeenCalledTimes(1);
+
+    act(() => {
+      vi.advanceTimersByTime(1000);
+    });
+
+    expect(onOpenChange).toHaveBeenCalledTimes(1);
+  });
+
+  it("cancels a pending grace-period timer when the tooltip closes immediately during the grace window", () => {
+    const onOpenChange = vi.fn();
+
+    // No Tooltip.Content here: its document-level Escape listener would also
+    // fire and call closeImmediate a second time, muddying the call count
+    // this test cares about. The trigger's own Escape handler is enough to
+    // exercise closeImmediate while a grace-period timer is pending.
+    render(
+      <Tooltip.Provider delayDuration={0}>
+        <Tooltip.Root onOpenChange={onOpenChange}>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    fireEvent.pointerEnter(screen.getByRole("button", { name: "Hover me" }));
+    expect(onOpenChange).toHaveBeenCalledTimes(1);
+
+    // Leaving the trigger starts the grace-period close timer...
+    fireEvent.pointerLeave(screen.getByRole("button", { name: "Hover me" }));
+    // ...then Escape closes immediately, which must cancel that pending timer.
+    fireEvent.keyDown(screen.getByRole("button", { name: "Hover me" }), {
+      key: "Escape",
+    });
+
+    expect(onOpenChange).toHaveBeenCalledTimes(2);
+
+    act(() => {
+      vi.advanceTimersByTime(100);
+    });
+
+    expect(onOpenChange).toHaveBeenCalledTimes(2);
+  });
+
+  it("cancels the grace-period close timer when the pointer moves into the content", () => {
+    render(
+      <Tooltip.Provider delayDuration={0}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    fireEvent.pointerEnter(screen.getByRole("button", { name: "Hover me" }));
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+
+    fireEvent.pointerLeave(screen.getByRole("button", { name: "Hover me" }));
+    fireEvent.pointerEnter(screen.getByRole("tooltip"));
+
+    act(() => {
+      vi.advanceTimersByTime(100);
+    });
+
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+  });
+
+  it("closes after the grace period once the pointer leaves the trigger without re-entering the content", () => {
+    render(
+      <Tooltip.Provider delayDuration={0}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    fireEvent.pointerEnter(screen.getByRole("button", { name: "Hover me" }));
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+
+    fireEvent.pointerLeave(screen.getByRole("button", { name: "Hover me" }));
+
+    // Still open right up until the grace period elapses.
+    expect(screen.getByRole("tooltip")).toBeInTheDocument();
+
+    act(() => {
+      vi.advanceTimersByTime(100);
+    });
+
+    expect(screen.queryByRole("tooltip")).toBeNull();
+  });
+
+  it("cancels a pending hover-delay open timer when the pointer leaves before it elapses, so the tooltip does not open later", () => {
+    render(
+      <Tooltip.Provider delayDuration={500}>
+        <Tooltip.Root>
+          <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+          <Tooltip.Content>Tooltip text</Tooltip.Content>
+        </Tooltip.Root>
+      </Tooltip.Provider>,
+    );
+
+    fireEvent.pointerEnter(screen.getByRole("button", { name: "Hover me" }));
+    fireEvent.pointerLeave(screen.getByRole("button", { name: "Hover me" }));
+
+    act(() => {
+      vi.advanceTimersByTime(500);
+    });
+
+    expect(screen.queryByRole("tooltip")).toBeNull();
+  });
+
+  it("uses the current onOpenChange callback for a grace-period close after a re-render", () => {
+    const firstOnOpenChange = vi.fn();
+    const secondOnOpenChange = vi.fn();
+
+    function Wrapper({
+      onOpenChange,
+    }: {
+      onOpenChange: (open: boolean) => void;
+    }) {
+      return (
+        <Tooltip.Provider delayDuration={0}>
+          <Tooltip.Root onOpenChange={onOpenChange}>
+            <Tooltip.Trigger>Hover me</Tooltip.Trigger>
+            <Tooltip.Content>Tooltip text</Tooltip.Content>
+          </Tooltip.Root>
+        </Tooltip.Provider>
+      );
+    }
+
+    const { rerender } = render(<Wrapper onOpenChange={firstOnOpenChange} />);
+    rerender(<Wrapper onOpenChange={secondOnOpenChange} />);
+
+    fireEvent.pointerEnter(screen.getByRole("button", { name: "Hover me" }));
+    fireEvent.pointerLeave(screen.getByRole("button", { name: "Hover me" }));
+
+    act(() => {
+      vi.advanceTimersByTime(100);
+    });
+
+    expect(firstOnOpenChange).not.toHaveBeenCalled();
+    expect(secondOnOpenChange).toHaveBeenCalledWith(true);
+    expect(secondOnOpenChange).toHaveBeenCalledWith(false);
+  });
+});