// @vitest-environment jsdom

import { act } from "react";
import { createRoot } from "react-dom/client";
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
import { MemoryRouter } from "@/lib/router";
import { TopStrip } from "./TopStrip";

// eslint-disable-next-line @typescript-eslint/no-explicit-any
(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true;

// Same stub as IconRail / ModeBreadcrumb tests — @/lib/router's Link
// (and useLocation consumers) trigger CompanyContext resolution.
vi.mock("@/context/CompanyContext", () => ({
  useCompany: () => ({
    companies: [],
    selectedCompany: null,
    selectedCompanyId: null,
    setSelectedCompanyId: () => {},
    selectionSource: null,
    loading: false,
  }),
}));

describe("TopStrip", () => {
  let container: HTMLDivElement;
  let root: ReturnType<typeof createRoot> | null = null;

  beforeEach(() => {
    container = document.createElement("div");
    document.body.appendChild(container);
    root = null;
  });

  afterEach(() => {
    if (root) {
      act(() => { root!.unmount(); });
      root = null;
    }
    if (container.parentNode) container.remove();
  });

  function render(pathname: string) {
    root = createRoot(container);
    act(() => {
      root!.render(
        <MemoryRouter initialEntries={[pathname]}>
          <TopStrip />
        </MemoryRouter>
      );
    });
  }

  it("renders the ModeBreadcrumb with derived segments", () => {
    render("/NEX/assistant");
    const segment = container.querySelector("[data-testid='mode-breadcrumb-segment']");
    expect(segment?.textContent?.trim()).toBe("ASSISTANT");
  });

  it("renders the CmdK button", () => {
    render("/NEX/assistant");
    expect(container.querySelector("button[aria-label='Open command palette']")).not.toBeNull();
  });

  it("renders the global mic button", () => {
    render("/NEX/assistant");
    expect(container.querySelector("button[aria-label='Voice']")).not.toBeNull();
  });

  it("is wrapped in a header element for landmark semantics", () => {
    render("/NEX/assistant");
    const header = container.querySelector("header");
    expect(header).not.toBeNull();
    expect(header?.getAttribute("aria-label")).toBe("Top bar");
  });
});