test(coverage): bootstrap vitest unit infra and add tests at 90%+ per file (#1245) (#1269)

* test(coverage): bootstrap vitest unit infra and add tests at 90%+ per file (#1245)

Establishes the unit-test runtime AGENTS.md mandates: a vitest "unit"
project alongside the existing storybook project, RTL + jest-dom +
happy-dom, a Mantine-aware render helper, and a 90%-line per-file
coverage gate enforced by CI. Adds 66 test files covering all 62
components under elements/groups/screens/views, plus core/mcp and
clients/web/src/utils. Total: 577 tests, 98.7% line coverage globally.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* test(coverage): address PR #1269 review feedback

- AGENTS.md: correct coverage gate description (lines ≥ 90, statements ≥ 85,
  functions ≥ 80, branches ≥ 50) with rationale for the relaxed branch
  threshold
- InspectorView.test.tsx: document what the Math.random() mock values
  (0.1 / 0.99) control vs. STUB_SUCCESS_RATE in InspectorView.tsx
- vite.config.ts / tsconfig.test.json: drop unused `globals: true` and the
  `vitest/globals` type now that every test file imports describe/it/expect/vi
  explicitly; manual `afterEach(cleanup)` in setup.ts remains required because
  testing-library auto-cleanup relies on globalThis.afterEach

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

clients/web/src/components/views/InspectorView/InspectorView.test.tsx

@@ -0,0 +1,158 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import userEvent from "@testing-library/user-event";
+import type { ServerEntry } from "@inspector/core/mcp/types.js";
+import {
+  renderWithMantine,
+  screen,
+  waitFor,
+} from "../../../test/renderWithMantine";
+import { InspectorView } from "./InspectorView";
+
+const baseProps = {
+  servers: [],
+  tools: [],
+  prompts: [],
+  resources: [],
+  resourceTemplates: [],
+  subscriptions: [],
+  logs: [],
+  tasks: [],
+  history: [],
+  onToggleTheme: vi.fn(),
+};
+
+const sampleServer: ServerEntry = {
+  id: "alpha",
+  name: "Alpha",
+  config: { type: "stdio", command: "echo" },
+  connection: { status: "disconnected" },
+};
+
+afterEach(() => {
+  vi.restoreAllMocks();
+});
+
+// The InspectorView's demo handshake stub uses Math.random() twice on each
+// connect: first to pick a delay (50–500 ms), then to decide success vs.
+// error against `STUB_SUCCESS_RATE = 0.85`. Mocking Math.random to a low
+// value (0.1) forces both a short delay and a "success" outcome (0.1 < 0.85);
+// 0.99 forces a short-ish delay and a "failure" (0.99 < 0.85 is false). Both
+// constants are defined in InspectorView.tsx — keep these values in sync if
+// the success rate ever changes.
+describe("InspectorView", () => {
+  it("renders the disconnected header by default", () => {
+    renderWithMantine(<InspectorView {...baseProps} />);
+    expect(
+      screen.getByText("No servers configured. Add a server to get started."),
+    ).toBeInTheDocument();
+  });
+
+  it("renders the server card from the input list", () => {
+    renderWithMantine(
+      <InspectorView {...baseProps} servers={[sampleServer]} />,
+    );
+    expect(screen.getByText("Alpha")).toBeInTheDocument();
+  });
+
+  it("transitions to connected on a successful handshake", async () => {
+    vi.spyOn(Math, "random").mockReturnValue(0.1);
+    const user = userEvent.setup();
+    renderWithMantine(
+      <InspectorView {...baseProps} servers={[sampleServer]} />,
+    );
+    await user.click(screen.getByRole("switch"));
+    await waitFor(
+      () => {
+        expect(
+          screen.queryByText(
+            "No servers configured. Add a server to get started.",
+          ),
+        ).not.toBeInTheDocument();
+      },
+      { timeout: 2000 },
+    );
+  });
+
+  it("transitions to error on a failed handshake", async () => {
+    vi.spyOn(Math, "random").mockReturnValue(0.99);
+    const user = userEvent.setup();
+    renderWithMantine(
+      <InspectorView {...baseProps} servers={[sampleServer]} />,
+    );
+    await user.click(screen.getByRole("switch"));
+    await waitFor(
+      () => {
+        expect(
+          screen.getByText("Server returned invalid response"),
+        ).toBeInTheDocument();
+      },
+      { timeout: 2000 },
+    );
+  });
+
+  it("disconnects when the connected server is toggled off", async () => {
+    vi.spyOn(Math, "random").mockReturnValue(0.1);
+    const user = userEvent.setup();
+    renderWithMantine(
+      <InspectorView {...baseProps} servers={[sampleServer]} />,
+    );
+    const toggle = screen.getByRole("switch");
+    await user.click(toggle);
+    await waitFor(
+      () => {
+        expect(toggle).toBeChecked();
+        expect(toggle).not.toBeDisabled();
+      },
+      { timeout: 2000 },
+    );
+    await user.click(toggle);
+    expect(toggle).not.toBeChecked();
+  });
+
+  it("renders ViewHeader connected when handshake succeeds", async () => {
+    vi.spyOn(Math, "random").mockReturnValue(0.1);
+    const user = userEvent.setup();
+    renderWithMantine(
+      <InspectorView {...baseProps} servers={[sampleServer]} />,
+    );
+    const toggle = screen.getByRole("switch");
+    await user.click(toggle);
+    await waitFor(
+      () => {
+        expect(toggle).toBeChecked();
+        expect(toggle).not.toBeDisabled();
+      },
+      { timeout: 2000 },
+    );
+    expect(screen.getAllByText("Alpha").length).toBeGreaterThan(0);
+  });
+
+  it("toggles autoScroll on the Logs screen after connecting", async () => {
+    vi.spyOn(Math, "random").mockReturnValue(0.1);
+    const user = userEvent.setup();
+    renderWithMantine(
+      <InspectorView {...baseProps} servers={[sampleServer]} />,
+    );
+    const toggle = screen.getByRole("switch");
+    await user.click(toggle);
+    await waitFor(
+      () => {
+        expect(toggle).toBeChecked();
+        expect(toggle).not.toBeDisabled();
+      },
+      { timeout: 2000 },
+    );
+    // Switch to Logs via the header Select. Mantine renders options into a
+    // hidden portal in happy-dom — find via getAllByText with hidden traversal.
+    const tabSelect = await screen.findByDisplayValue("Servers");
+    await user.click(tabSelect);
+    const logsOption = await screen.findByText("Logs");
+    await user.click(logsOption);
+    const autoScroll = await screen.findByRole("checkbox", {
+      name: "Auto-scroll",
+    });
+    expect(autoScroll).toBeChecked();
+    await user.click(autoScroll);
+    expect(autoScroll).not.toBeChecked();
+  });
+});