import { render } from "@solidjs/testing-library";
import { describe, expect, it } from "vitest";
import { Portal } from "../../src/utilities/portal/portal";

describe("Portal", () => {
  it("renders children into document.body by default", () => {
    render(() => (
      <Portal>
        <div data-testid="portal-content">hello</div>
      </Portal>
    ));
    // Content should be in document.body, not the render container
    expect(document.body.querySelector("[data-testid='portal-content']")).toBeTruthy();
  });

  it("renders children into a custom target", () => {
    const target = document.createElement("div");
    document.body.appendChild(target);
    render(() => (
      <Portal target={target}>
        <div data-testid="custom-portal">hello</div>
      </Portal>
    ));
    expect(target.querySelector("[data-testid='custom-portal']")).toBeTruthy();
    document.body.removeChild(target);
  });
});