feat(anonymous-sessions): add anonymous sessions support (EA)

README.md

@@ -13,6 +13,7 @@ The Auth0 Next.js SDK is a library for implementing user authentication in Next.
 
 - [QuickStart](https://auth0.com/docs/quickstart/webapp/nextjs) - our guide for adding Auth0 to your Next.js app.
 - [Examples](https://github.com/auth0/nextjs-auth0/blob/main/EXAMPLES.md) - lots of examples for your different use cases.
+- [Anonymous Sessions](./docs/anonymous-sessions.md) - enable pre-login identity with access tokens and metadata.
 - [Security](https://github.com/auth0/nextjs-auth0/blob/main/SECURITY.md) - Some important security notices that you should check.
 - [Docs Site](https://auth0.com/docs) - explore our docs site and learn more about Auth0.
 

src/client/hooks/use-anonymous-session.test.ts

@@ -0,0 +1,195 @@
+/**
+ * @vitest-environment jsdom
+ */
+
+import { act, cleanup, renderHook, waitFor } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import type { AnonymousSession } from "../../types/index.js";
+import { useAnonymousSession } from "./use-anonymous-session.js";
+
+describe("M4 BLOCKER: FR-3 useAnonymousSession Hook REAL execution", () => {
+  const mockSession: AnonymousSession = {
+    id: "anon@uuid-1234",
+    accessToken: "bearer-token-xyz",
+    expiresAt: Math.floor(Date.now() / 1000) + 3600,
+    metadata: { cart: { qty: 5 } }
+  };
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    // Clear global fetch mock before each test
+    global.fetch = vi.fn();
+  });
+
+  afterEach(() => {
+    // Clean up React components and SWR cache after each test
+    cleanup();
+  });
+
+  describe("Hook with REAL SWR execution", () => {
+    it("M4: Hook returns 200 → {anonymous: session, isLoading: false}", async () => {
+      // Mock fetch to return 200 with session
+      global.fetch = vi.fn().mockResolvedValue({
+        ok: true,
+        status: 200,
+        json: async () => mockSession
+      });
+
+      // Use unique route per test to avoid SWR cache collision
+      const { result } = renderHook(() =>
+        useAnonymousSession({ route: "/test/anon-200" })
+      );
+
+      // Wait for SWR to fetch (SWR may skip loading state if data arrives fast)
+      await waitFor(() => {
+        expect(result.current.anonymous).toEqual(mockSession);
+      });
+
+      // ASSERT: session loaded
+      expect(result.current.error).toBeNull();
+      expect(global.fetch).toHaveBeenCalled();
+    });
+
+    it("M4: Hook returns 204 → {anonymous: null, isLoading: false}", async () => {
+      // Mock fetch to return 204 (no session)
+      global.fetch = vi.fn().mockResolvedValue({
+        ok: true,
+        status: 204
+      });
+
+      const { result } = renderHook(() =>
+        useAnonymousSession({ route: "/test/anon-204" })
+      );
+
+      await waitFor(() => {
+        expect(result.current.isLoading).toBe(false);
+      });
+
+      // ASSERT: no session (null)
+      expect(result.current.anonymous).toBeNull();
+      expect(result.current.error).toBeNull();
+    });
+
+    it("M4: Hook fetch error → {error: Error, anonymous: null, isLoading: false}", async () => {
+      // Mock fetch to return error
+      global.fetch = vi.fn().mockResolvedValue({
+        ok: false,
+        status: 500
+      });
+
+      const { result } = renderHook(() =>
+        useAnonymousSession({ route: "/test/anon-error" })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.error).toBeTruthy();
+        },
+        { timeout: 3000 }
+      );
+
+      // ASSERT: error state
+      expect(result.current.error).toBeInstanceOf(Error);
+      expect(result.current.anonymous).toBeNull();
+      expect(result.current.isLoading).toBe(false);
+    });
+
+    it("M4: isLoading false after data loads", async () => {
+      global.fetch = vi.fn().mockResolvedValue({
+        ok: true,
+        status: 200,
+        json: async () => mockSession
+      });
+
+      const { result } = renderHook(() =>
+        useAnonymousSession({ route: "/test/anon-loading" })
+      );
+
+      // Wait for load to complete
+      await waitFor(() => {
+        expect(result.current.isLoading).toBe(false);
+      });
+
+      expect(result.current.anonymous).toEqual(mockSession);
+    });
+
+    it("M4: invalidate() triggers SWR revalidation", async () => {
+      let callCount = 0;
+      global.fetch = vi.fn().mockImplementation(async () => {
+        callCount++;
+        return {
+          ok: true,
+          status: 200,
+          json: async () => ({
+            ...mockSession,
+            id: `anon@call-${callCount}`
+          })
+        };
+      });
+
+      const { result } = renderHook(() =>
+        useAnonymousSession({ route: "/test/anon-invalidate" })
+      );
+
+      // Wait for initial fetch
+      await waitFor(() => {
+        expect(callCount).toBeGreaterThanOrEqual(1);
+      });
+
+      const firstId = result.current.anonymous?.id;
+
+      // Call invalidate to trigger refetch
+      await act(async () => {
+        result.current.invalidate();
+      });
+
+      // Wait for ID to change (React render commit)
+      await waitFor(() => {
+        expect(result.current.anonymous?.id).not.toBe(firstId);
+      });
+
+      // Verify refetch happened
+      expect(callCount).toBeGreaterThanOrEqual(2);
+    });
+
+    it("M4: Hook uses custom route from options", async () => {
+      global.fetch = vi.fn().mockResolvedValue({
+        ok: true,
+        status: 200,
+        json: async () => mockSession
+      });
+
+      renderHook(() => useAnonymousSession({ route: "/custom/anon-route" }));
+
+      await waitFor(() => {
+        expect(global.fetch).toHaveBeenCalled();
+      });
+
+      // Verify fetch was called with custom route
+      const fetchCall = (global.fetch as any).mock.calls[0];
+      expect(fetchCall[0]).toContain("/custom/anon-route");
+    });
+
+    it("M4: Hook returns correct shape {anonymous, isLoading, error, invalidate}", async () => {
+      global.fetch = vi.fn().mockResolvedValue({
+        ok: true,
+        status: 200,
+        json: async () => mockSession
+      });
+
+      const { result } = renderHook(() => useAnonymousSession());
+
+      await waitFor(() => {
+        expect(result.current.isLoading).toBe(false);
+      });
+
+      // ASSERT: shape matches contract
+      expect(result.current).toHaveProperty("anonymous");
+      expect(result.current).toHaveProperty("isLoading");
+      expect(result.current).toHaveProperty("error");
+      expect(result.current).toHaveProperty("invalidate");
+      expect(typeof result.current.invalidate).toBe("function");
+    });
+  });
+});

src/client/hooks/use-anonymous-session.ts

@@ -0,0 +1,101 @@
+"use client";
+
+import useSWR from "swr";
+
+import type {
+  AnonymousSession,
+  UseAnonymousSessionOptions
+} from "../../types/index.js";
+import { normalizeWithBasePath } from "../../utils/pathUtils.js";
+
+/**
+ * Fetch the anonymous session from the read route.
+ *
+ * The route answers 204 with an empty body when there is no session, which maps
+ * to null, and 200 with the session object otherwise. Any other status is a
+ * failure the hook surfaces through `error`.
+ *
+ * The return type is declared rather than inferred so the session case is a
+ * concrete value rather than the `any` that `Response.json()` produces. That is
+ * what keeps `null` from being the only value a reader (human or static analysis)
+ * can see the fetcher resolve to.
+ */
+async function fetchAnonymousSession(
+  route: string
+): Promise<AnonymousSession | null> {
+  const res = await fetch(route);
+
+  if (!res.ok) {
+    throw new Error("Failed to load anonymous session");
+  }
+
+  // 204 No Content → null (no session)
+  if (res.status === 204) {
+    return null;
+  }
+
+  // 200 + JSON → return session object
+  return (await res.json()) as AnonymousSession;
+}
+
+/**
+ * Client hook: fetch and cache anonymous session via SWR.
+ * Mirrors the useUser() pattern.
+ *
+ * Returns:
+ * - anonymous: AnonymousSession | null (null if no session or fetch error)
+ * - isLoading: boolean (false when error or data loaded)
+ * - error: Error | null (populated on fetch error)
+ * - invalidate: () => void (trigger SWR revalidate)
+ *
+ * Uses SWR key: resolved route (option, env var, or default "/auth/anonymous-session")
+ * Fetcher: standard fetch, returns null on 204 status, throws on !ok
+ *
+ * Test: T7 (hook + provider)
+ */
+export function useAnonymousSession(options: UseAnonymousSessionOptions = {}): {
+  anonymous: AnonymousSession | null;
+  isLoading: boolean;
+  error: Error | null;
+  invalidate: () => void;
+} {
+  // Resolve SWR key (route path, normalized with basePath)
+  const route = normalizeWithBasePath(
+    options.route ||
+      process.env.NEXT_PUBLIC_ANONYMOUS_SESSION_ROUTE ||
+      "/auth/anonymous-session"
+  );
+
+  // Fetch via SWR with standard error handling
+  const { data, error, isLoading, mutate } = useSWR<
+    AnonymousSession | null,
+    Error,
+    string
+  >(route, fetchAnonymousSession);
+
+  // Return shape matching useUser() pattern
+  if (error) {
+    return {
+      anonymous: null,
+      isLoading: false,
+      error,
+      invalidate: () => mutate()
+    };
+  }
+
+  // The fetcher resolves to null for a 204, so `data` carries three distinct
+  // states: undefined while the first request is in flight, null once the route
+  // has answered that there is no session, and the session object otherwise. A
+  // truthiness test cannot tell the first two apart, and it reads as a test that
+  // can never succeed to a reader that only sees the null-returning branch of the
+  // fetcher. Comparing against undefined names the state that is actually being
+  // asked about, and every branch below is reachable for some value of `data`.
+  const hasLoaded = data !== undefined;
+
+  return {
+    anonymous: data ?? null,
+    isLoading: hasLoaded ? false : isLoading,
+    error: null,
+    invalidate: () => mutate()
+  };
+}

src/client/index.ts

@@ -1,4 +1,5 @@
 export { useUser, type UseUserOptions } from "./hooks/use-user.js";
+export { useAnonymousSession } from "./hooks/use-anonymous-session.js";
 export {
   getAccessToken,
   type AccessTokenOptions
@@ -17,3 +18,4 @@ export type { ChallengeWithPopupOptions } from "./mfa/index.js";
 export type { AccessTokenResponse } from "./helpers/get-access-token.js";
 export { passwordless } from "./passwordless/index.js";
 export { passkey, serializeCredential } from "./passkey/index.js";
+export type { UseAnonymousSessionOptions } from "../types/index.js";