OmniRoute/tests/unit/ui/use-system-proxy-exit-guard.test.tsx

/**
 * Tests for useSystemProxyExitGuard — beforeunload listener + sendBeacon revert.
 *
 * Strategy: test the hook logic directly without React — we exercise the same
 * branches as the hook by simulating mount/unmount via the cleanup pattern.
 * This matches how use-traffic-stream.test.tsx tests hook logic (pure logic,
 * no React renderer needed).
 */
import { describe, it, before, after, beforeEach, afterEach, mock } from "node:test";
import assert from "node:assert/strict";

// ---------------------------------------------------------------------------
// Minimal beforeunload event simulation
// ---------------------------------------------------------------------------

type BeforeUnloadListener = (e: {
  preventDefault: () => void;
  returnValue: string;
}) => void;

let registeredListeners: Array<{ type: string; fn: BeforeUnloadListener }> = [];
let beaconCalls: Array<{ url: string; body: string }> = [];

const mockWindow = {
  addEventListener(type: string, fn: BeforeUnloadListener) {
    registeredListeners.push({ type, fn });
  },
  removeEventListener(type: string, fn: BeforeUnloadListener) {
    registeredListeners = registeredListeners.filter((l) => l.type !== type || l.fn !== fn);
  },
};

const mockNavigator = {
  sendBeacon(url: string, data: Blob | string | null) {
    let body = "";
    if (typeof data === "string") {
      body = data;
    } else if (data instanceof Blob) {
      // In Node test env, Blob is available (Node 18+). We synchronously read
      // the content by constructing from JSON directly via the known test data.
      // We store the URL for assertion — exact body checked separately.
      body = "<blob>";
    }
    beaconCalls.push({ url, body });
    return true;
  },
};

// ---------------------------------------------------------------------------
// Simulate the hook logic (mirrors useSystemProxyExitGuard implementation)
// to make it testable without jsdom / React.
// ---------------------------------------------------------------------------

interface GuardOpts {
  applied: boolean;
  endpoint?: string;
}

function mountGuard(opts: GuardOpts): () => void {
  let appliedRef = opts.applied;

  const endpoint =
    opts.endpoint ?? "/api/tools/traffic-inspector/capture-modes/system-proxy";
  const body = JSON.stringify({ action: "revert" });
  const blob = new Blob([body], { type: "application/json" });

  const beforeUnload: BeforeUnloadListener = (e) => {
    if (!appliedRef) return;
    try {
      mockNavigator.sendBeacon(endpoint, blob);
    } catch {
      /* ignore */
    }
    e.preventDefault();
    e.returnValue = "System-wide proxy still active — leave page anyway?";
  };

  mockWindow.addEventListener("beforeunload", beforeUnload);

  // Return cleanup (simulates useEffect cleanup / unmount)
  const cleanup = () => {
    mockWindow.removeEventListener("beforeunload", beforeUnload);
    if (appliedRef) {
      try {
        mockNavigator.sendBeacon(endpoint, blob);
      } catch {
        /* ignore */
      }
    }
  };

  // Expose a way to update appliedRef (simulates re-render with new prop)
  (cleanup as unknown as { setApplied: (v: boolean) => void }).setApplied = (v: boolean) => {
    appliedRef = v;
  };

  return cleanup;
}

// ---------------------------------------------------------------------------
// Tests
// ---------------------------------------------------------------------------

describe("useSystemProxyExitGuard hook logic", () => {
  beforeEach(() => {
    registeredListeners = [];
    beaconCalls = [];
  });

  it("adds beforeunload listener on mount", () => {
    const cleanup = mountGuard({ applied: false });
    assert.equal(registeredListeners.length, 1);
    assert.equal(registeredListeners[0].type, "beforeunload");
    cleanup();
  });

  it("fires sendBeacon with correct endpoint and body when applied=true on beforeunload", () => {
    const endpoint = "/api/tools/traffic-inspector/capture-modes/system-proxy";
    const cleanup = mountGuard({ applied: true, endpoint });

    // Simulate browser firing beforeunload
    const fakeEvent = { preventDefault: () => {}, returnValue: "" };
    registeredListeners[0].fn(fakeEvent);

    assert.equal(beaconCalls.length, 1);
    assert.equal(beaconCalls[0].url, endpoint);
    cleanup();
  });

  it("does NOT fire sendBeacon on beforeunload when applied=false", () => {
    const cleanup = mountGuard({ applied: false });

    const fakeEvent = { preventDefault: () => {}, returnValue: "" };
    registeredListeners[0].fn(fakeEvent);

    assert.equal(beaconCalls.length, 0);
    cleanup();
  });

  it("removes beforeunload listener on unmount", () => {
    const cleanup = mountGuard({ applied: false });
    assert.equal(registeredListeners.length, 1);
    cleanup();
    assert.equal(registeredListeners.length, 0);
  });

  it("fires sendBeacon on unmount when applied=true (SPA navigation revert)", () => {
    const cleanup = mountGuard({ applied: true });

    // No beforeunload triggered — just unmount (SPA navigation)
    cleanup();

    assert.equal(beaconCalls.length, 1);
    assert.equal(
      beaconCalls[0].url,
      "/api/tools/traffic-inspector/capture-modes/system-proxy"
    );
  });

  it("does NOT fire sendBeacon on unmount when applied=false", () => {
    const cleanup = mountGuard({ applied: false });
    cleanup();
    assert.equal(beaconCalls.length, 0);
  });

  it("uses custom endpoint when provided", () => {
    const customEndpoint = "/api/custom/system-proxy";
    const cleanup = mountGuard({ applied: true, endpoint: customEndpoint });
    cleanup();
    assert.equal(beaconCalls[0].url, customEndpoint);
  });

  it("sets returnValue on beforeunload event when applied=true", () => {
    const cleanup = mountGuard({ applied: true });

    const fakeEvent = { preventDefault: () => {}, returnValue: "" };
    registeredListeners[0].fn(fakeEvent);

    assert.equal(fakeEvent.returnValue, "System-wide proxy still active — leave page anyway?");
    cleanup();
  });
});