Fix tenant-origin RPC requests and combined auth regression coverage

Author: shaply

lib/api.ts

@@ -1,11 +1,14 @@
 import type { AppType } from "@/lib/app";
 import { hc } from "hono/client";
-import { getBaseUrl } from "./clientUtils";
+import { getBaseUrl } from "@/lib/clientUtils";
 
-const client = hc<AppType>(getBaseUrl(), {
-  init: {
-    credentials: "include",
+const client = hc<AppType>(
+  typeof window === "undefined" ? getBaseUrl() : window.location.origin,
+  {
+    init: {
+      credentials: "include",
+    },
   },
-});
+);
 
 export default client.api;

tests/e2e/auth-tenant-origin.spec.ts

@@ -0,0 +1,30 @@
+import { expect, test } from "@playwright/test";
+
+// One server/build serves both tenant hosts. Do not intercept the config API:
+// the browser must be able to read its real 404 from the visited origin.
+for (const slug of ["missing-auth-a", "missing-auth-b"]) {
+  for (const path of [
+    "/login",
+    "/signup",
+    "/forgotpassword",
+    "/resetpassword?token=test-token",
+  ]) {
+    test(`shows missing organization at ${slug}${path}`, async ({
+      page,
+      baseURL,
+    }) => {
+      const url = new URL(baseURL ?? "http://localhost:3000");
+      url.hostname = `${slug}.lvh.me`;
+      const responsePromise = page.waitForResponse(
+        (response) =>
+          new URL(response.url()).pathname === "/api/organizationConfig",
+      );
+      await page.goto(new URL(path, url).href);
+      const response = await responsePromise;
+      expect(new URL(response.url()).origin).toBe(url.origin);
+      expect(response.status()).toBe(404);
+      await expect(page.getByTestId("organization-not-found")).toBeVisible();
+      await expect(page.locator("input")).toHaveCount(0);
+    });
+  }
+}

tests/e2e/login.spec.ts

@@ -78,11 +78,4 @@ test.describe("Login Page", () => {
     expect(normalized).toContain(primary);
     expect(normalized).toContain(secondary);
   });
-
-  // No e2e coverage for the not-found state: `lib/api.ts` builds the RPC client
-  // against getBaseUrl() (NEXT_PUBLIC_BASE_URL), so every tenant's API calls go to
-  // one fixed origin. Loading a page on any other host makes that call cross-origin
-  // and the browser blocks it before the 404 is readable, so the hook sees a network
-  // error rather than "not-found". Covered by the unit tests on useOrganizationConfig
-  // until the API client resolves per-tenant origins.
 });

tests/unit/lib/api.test.ts

@@ -0,0 +1,34 @@
+// @vitest-environment node
+import { afterEach, describe, expect, it, vi } from "vitest";
+
+vi.mock("@/lib/clientUtils", () => ({
+  getBaseUrl: () => "https://configured.servicestart.com",
+}));
+
+afterEach(() => {
+  vi.unstubAllGlobals();
+  vi.resetModules();
+});
+
+describe("typed API client origin", () => {
+  it.each(["acme", "missing-tenant"])(
+    "uses the visited %s tenant in a browser",
+    async (slug) => {
+      vi.stubGlobal("window", {
+        location: { origin: `https://${slug}.servicestart.com` },
+      });
+      const { default: api } = await import("@/lib/api");
+      expect(api.organizationConfig.$url().origin).toBe(
+        `https://${slug}.servicestart.com`,
+      );
+    },
+  );
+
+  it("uses the configured absolute origin on the server", async () => {
+    vi.stubGlobal("window", undefined);
+    const { default: api } = await import("@/lib/api");
+    expect(api.organizationConfig.$url().origin).toBe(
+      "https://configured.servicestart.com",
+    );
+  });
+});

tests/unit/lib/hooks/useOrganizationConfig.test.tsx

@@ -302,67 +302,77 @@ describe("useOrganizationConfig", () => {
       "#FB3552",
     );
   });
-});
-
-it("resolves to documented defaults when the hook has not loaded branding yet", () => {
-  const branding = resolveBranding({});
 
-  expect(branding[OrganizationConfigKey.PrimaryColor]).toBe(
-    DEFAULT_BRANDING[OrganizationConfigKey.PrimaryColor],
-  );
-  expect(branding[OrganizationConfigKey.SecondaryColor]).toBe(
-    DEFAULT_BRANDING[OrganizationConfigKey.SecondaryColor],
-  );
-});
+  it("resolves to documented defaults when the hook has not loaded branding yet", () => {
+    const branding = resolveBranding({});
 
-it("resolves hook results the same way as server defaults for missing branding", async () => {
-  mockGet.mockImplementation(() =>
-    Promise.resolve({
-      json: () => Promise.resolve({}),
-    }),
-  );
-
-  const keys = [
-    OrganizationConfigKey.PrimaryColor,
-    OrganizationConfigKey.SecondaryColor,
-  ] as const;
-  const { result } = renderHook(() => useOrganizationConfig(keys));
-
-  await waitFor(() => {
-    expect(mockGet).toHaveBeenCalled();
-  });
-
-  expect(resolveBranding(result.current)).toEqual({
-    [OrganizationConfigKey.PrimaryColor]:
+    expect(branding[OrganizationConfigKey.PrimaryColor]).toBe(
       DEFAULT_BRANDING[OrganizationConfigKey.PrimaryColor],
-    [OrganizationConfigKey.SecondaryColor]:
+    );
+    expect(branding[OrganizationConfigKey.SecondaryColor]).toBe(
       DEFAULT_BRANDING[OrganizationConfigKey.SecondaryColor],
+    );
   });
-});
 
-it("keeps a configured primary color from the hook and defaults the secondary", async () => {
-  mockGet.mockImplementation(() =>
-    Promise.resolve({
-      json: () =>
-        Promise.resolve({
-          [OrganizationConfigKey.PrimaryColor]: "#000000",
-        }),
-    }),
-  );
-
-  const keys = [
-    OrganizationConfigKey.PrimaryColor,
-    OrganizationConfigKey.SecondaryColor,
-  ] as const;
-  const { result } = renderHook(() => useOrganizationConfig(keys));
-
-  await waitFor(() => {
-    expect(result.current[OrganizationConfigKey.PrimaryColor]).toBe("#000000");
+  it("resolves hook results the same way as server defaults for missing branding", async () => {
+    mockGet.mockImplementation(() =>
+      Promise.resolve({
+        ok: true,
+        status: 200,
+        json: () =>
+          Promise.resolve({ primary_color: null, secondary_color: null }),
+      }),
+    );
+
+    const keys = [
+      OrganizationConfigKey.PrimaryColor,
+      OrganizationConfigKey.SecondaryColor,
+    ] as const;
+    const { result } = renderHook(() => useOrganizationConfig(keys));
+
+    await waitFor(() => {
+      expect(result.current[OrganizationConfigKey.PrimaryColor]).toBeNull();
+      expect(result.current[OrganizationConfigKey.SecondaryColor]).toBeNull();
+      expect(result.current.status).toBe("ok");
+    });
+
+    expect(resolveBranding(result.current)).toEqual({
+      [OrganizationConfigKey.PrimaryColor]:
+        DEFAULT_BRANDING[OrganizationConfigKey.PrimaryColor],
+      [OrganizationConfigKey.SecondaryColor]:
+        DEFAULT_BRANDING[OrganizationConfigKey.SecondaryColor],
+    });
   });
 
-  expect(resolveBranding(result.current)).toEqual({
-    [OrganizationConfigKey.PrimaryColor]: "#000000",
-    [OrganizationConfigKey.SecondaryColor]:
-      DEFAULT_BRANDING[OrganizationConfigKey.SecondaryColor],
+  it("keeps a configured primary color from the hook and defaults the secondary", async () => {
+    mockGet.mockImplementation(() =>
+      Promise.resolve({
+        ok: true,
+        status: 200,
+        json: () =>
+          Promise.resolve({
+            [OrganizationConfigKey.PrimaryColor]: "#000000",
+          }),
+      }),
+    );
+
+    const keys = [
+      OrganizationConfigKey.PrimaryColor,
+      OrganizationConfigKey.SecondaryColor,
+    ] as const;
+    const { result } = renderHook(() => useOrganizationConfig(keys));
+
+    await waitFor(() => {
+      expect(result.current[OrganizationConfigKey.PrimaryColor]).toBe(
+        "#000000",
+      );
+      expect(result.current.status).toBe("ok");
+    });
+
+    expect(resolveBranding(result.current)).toEqual({
+      [OrganizationConfigKey.PrimaryColor]: "#000000",
+      [OrganizationConfigKey.SecondaryColor]:
+        DEFAULT_BRANDING[OrganizationConfigKey.SecondaryColor],
+    });
   });
 });