Not able to find tooltip in the document

Question

So I am using tooltip from Salt Design System in my code https://www.saltdesignsystem.com/salt/components/tooltip/examples

I am trying to write a test using React Testing Library. But I could not find the tooltip in the document when I fire the mouseover event on button. Below is my component code and unit test. What could I be doing wrong ?

App.tsx

import { Button, Tooltip } from "@salt-ds/core";

function App() {
  return (
    <Tooltip content="hakuna matata">
      <Button>Click me</Button>
    </Tooltip>
  );
}
export default App;

App.spec.tsx

import {
  act,
  fireEvent,
  render,
  screen,
  waitFor,
} from "@testing-library/react";
import App from "./App";
import userEvent from "@testing-library/user-event";

describe("App", () => {
  it("should open tooltip", async () => {
    render(<App />);
    const btn = screen.getByText("Click me");
    expect(btn).toBeInTheDocument();
    fireEvent.mouseOver(btn);
    expect(await screen.findByText("hakuna matata")).toBeInTheDocument();
  });
});

UPDATE

One thing I noticed in inspect element is that the tooltip is kind of rendered like a portal outside the root element