@vertesia/ui 1.6.0-dev.20260918.090710Z → 1.6.0-dev.20260923.085325Z

package/src/session/UserSessionProvider.iframe.test.tsx

@@ -0,0 +1,178 @@
+import { cleanup, render, waitFor } from '@testing-library/react';
+import { type AuthTokenPayload, PrincipalType } from '@vertesia/common';
+import { Env } from '@vertesia/ui/env';
+import { onAuthStateChanged } from 'firebase/auth';
+import { afterEach, expect, it, vi } from 'vitest';
+import {
+    IFRAME_APP_HOST_ORIGIN_PARAM,
+    IFRAME_AUTH_RESPONSE,
+    requestIframeHostAuthToken,
+} from '../shell/apps/iframe-auth';
+import { getComposableToken } from './auth/composable';
+import { redirectToCentralAuth, shouldRedirectToCentralAuth } from './auth/domainRouting';
+import { getFirebaseAuth } from './auth/firebase';
+import { useUserSession } from './UserSession';
+import { UserSessionProvider } from './UserSessionProvider';
+
+vi.mock('./auth/composable', async (original) => ({
+    ...(await original<typeof import('./auth/composable')>()),
+    getComposableToken: vi.fn(),
+}));
+vi.mock('./auth/domainRouting', async (original) => ({
+    ...(await original<typeof import('./auth/domainRouting')>()),
+    redirectToCentralAuth: vi.fn(),
+    shouldRedirectToCentralAuth: vi.fn(() => true),
+}));
+vi.mock('./auth/firebase', () => ({ getFirebaseAuth: vi.fn() }));
+vi.mock('firebase/auth', async (original) => ({
+    ...(await original<typeof import('firebase/auth')>()),
+    onAuthStateChanged: vi.fn(() => vi.fn()),
+}));
+
+const originalParent = Object.getOwnPropertyDescriptor(window, 'parent');
+const hostOrigin = 'https://cloud.vertesia.io';
+
+afterEach(() => {
+    cleanup();
+    vi.clearAllMocks();
+    if (originalParent) Object.defineProperty(window, 'parent', originalParent);
+    else Reflect.deleteProperty(window, 'parent');
+    window.history.replaceState(null, '', '/');
+    sessionStorage.clear();
+    localStorage.clear();
+});
+
+function init(options: { allowLegacyIframeAuth?: boolean; isLocalDev?: boolean; provider?: boolean } = {}) {
+    Env.init({
+        name: 'test',
+        version: '1',
+        type: 'production',
+        isDocker: false,
+        isLocalDev: options.isLocalDev ?? false,
+        allowLegacyIframeAuth: options.allowLegacyIframeAuth,
+        endpoints: {
+            studio: 'https://api.dev1.vertesia.io',
+            zeno: 'https://api.dev1.vertesia.io',
+            sts: 'https://sts.dev1.vertesia.io',
+        },
+        authTokenProvider: options.provider === false ? undefined : () => requestIframeHostAuthToken(20),
+    });
+    window.history.replaceState(null, '', `/?${IFRAME_APP_HOST_ORIGIN_PARAM}=${encodeURIComponent(hostOrigin)}`);
+}
+
+function embed(response?: { token?: string; expiresAt?: number }) {
+    const parentWindow = {
+        postMessage: vi.fn((request: { requestId: string }) => {
+            if (!response) return;
+            queueMicrotask(() =>
+                window.dispatchEvent(
+                    new MessageEvent('message', {
+                        source: parentWindow as unknown as Window,
+                        origin: hostOrigin,
+                        data: { type: IFRAME_AUTH_RESPONSE, requestId: request.requestId, ...response },
+                    }),
+                ),
+            );
+        }),
+    };
+    Object.defineProperty(window, 'parent', { configurable: true, value: parentWindow });
+    return parentWindow;
+}
+
+function Probe() {
+    const session = useUserSession();
+    return <span>{session.isLoading ? 'loading' : (session.authError?.message ?? session.user?.name ?? 'ready')}</span>;
+}
+
+const hostFailures = [
+    { name: 'denied', response: {} },
+    { name: 'expired', response: { token: 'expired', expiresAt: 0 } },
+    { name: 'NaN expiry', response: { token: 'invalid', expiresAt: Number.NaN } },
+    { name: 'infinite expiry', response: { token: 'invalid', expiresAt: Number.POSITIVE_INFINITY } },
+    { name: 'timeout', response: undefined },
+];
+
+it.each(hostFailures)('does not fall back after a $name host response', async ({ response }) => {
+    init();
+    const parentWindow = embed(response);
+    const view = render(
+        <UserSessionProvider>
+            <Probe />
+        </UserSessionProvider>,
+    );
+    await view.findByText('Embedded authentication requires a valid token from the host.');
+    expect(parentWindow.postMessage).toHaveBeenCalled();
+    expect(getComposableToken).not.toHaveBeenCalled();
+    expect(redirectToCentralAuth).not.toHaveBeenCalled();
+    expect(getFirebaseAuth).not.toHaveBeenCalled();
+    expect(onAuthStateChanged).not.toHaveBeenCalled();
+});
+
+it.each([undefined, false])(
+    'fails closed locally without a provider (allowLegacyIframeAuth=%s)',
+    async (allowLegacyIframeAuth) => {
+        init({ isLocalDev: true, allowLegacyIframeAuth, provider: false });
+        embed();
+        const view = render(
+            <UserSessionProvider>
+                <Probe />
+            </UserSessionProvider>,
+        );
+        await view.findByText('Embedded authentication requires a valid token from the host.');
+        expect(redirectToCentralAuth).not.toHaveBeenCalled();
+        expect(getFirebaseAuth).not.toHaveBeenCalled();
+    },
+);
+
+it.each([false, true])('preserves explicit legacy fallback (central=%s)', async (central) => {
+    init({ allowLegacyIframeAuth: true });
+    embed({});
+    vi.mocked(shouldRedirectToCentralAuth).mockReturnValue(central);
+    render(
+        <UserSessionProvider>
+            <Probe />
+        </UserSessionProvider>,
+    );
+    await waitFor(() => expect(central ? redirectToCentralAuth : onAuthStateChanged).toHaveBeenCalled());
+});
+
+it('preserves standalone sign-in when no host is present', async () => {
+    init();
+    vi.mocked(shouldRedirectToCentralAuth).mockReturnValue(true);
+    render(
+        <UserSessionProvider>
+            <Probe />
+        </UserSessionProvider>,
+    );
+    await waitFor(() => expect(redirectToCentralAuth).toHaveBeenCalled());
+});
+
+it('uses a valid scoped host token without starting another auth flow', async () => {
+    init();
+    const claims: AuthTokenPayload = {
+        sub: 'user',
+        user_id: 'user',
+        name: 'Embedded user',
+        type: PrincipalType.OAuthAccess,
+        iss: 'https://sts.dev1.vertesia.io',
+        aud: 'https://sts.dev1.vertesia.io',
+        apps: [],
+        accounts: [],
+        account_roles: [],
+        account: { id: 'a', name: 'Account' },
+        project: { id: 'p', name: 'Project', account: 'a' },
+        exp: Math.floor(Date.now() / 1000) + 3600,
+    };
+    const token = `e30.${btoa(JSON.stringify(claims))}.signature`;
+    embed({ token, expiresAt: Date.now() + 60_000 });
+    vi.mocked(getComposableToken).mockResolvedValue({ rawToken: token, token: claims, error: false });
+    const view = render(
+        <UserSessionProvider loadOnboardingStatus={false}>
+            <Probe />
+        </UserSessionProvider>,
+    );
+    await view.findByText('Embedded user');
+    expect(getComposableToken).toHaveBeenCalledWith(undefined, undefined, token, false, true);
+    expect(redirectToCentralAuth).not.toHaveBeenCalled();
+    expect(onAuthStateChanged).not.toHaveBeenCalled();
+});

package/src/session/UserSessionProvider.state-mismatch.test.tsx

@@ -0,0 +1,43 @@
+import { cleanup, render, waitFor } from '@testing-library/react';
+import { Env } from '@vertesia/ui/env';
+import { afterEach, expect, it, vi } from 'vitest';
+import { UserSessionProvider } from './UserSessionProvider';
+
+const mocks = vi.hoisted(() => ({ clear: vi.fn(), redirect: vi.fn(), exchange: vi.fn() }));
+vi.mock('./auth/useAuthState', () => ({
+    useAuthState: () => ({ verifyState: () => 'mismatch', clearState: mocks.clear }),
+}));
+vi.mock('./auth/domainRouting', async (original) => ({
+    ...(await original<typeof import('./auth/domainRouting')>()),
+    shouldRedirectToCentralAuth: () => true,
+    redirectToCentralAuth: mocks.redirect,
+}));
+vi.mock('./auth/composable', async (original) => ({
+    ...(await original<typeof import('./auth/composable')>()),
+    getComposableToken: mocks.exchange,
+}));
+afterEach(() => {
+    cleanup();
+    vi.clearAllMocks();
+    window.history.replaceState(null, '', '/');
+});
+it('clears a mismatched fragment and returns without exchanging credentials', async () => {
+    window.history.replaceState(null, '', '/#token=untrusted&state=wrong');
+    Env.init({
+        name: 'test',
+        version: '1',
+        type: 'production',
+        isLocalDev: false,
+        isDocker: false,
+        endpoints: { studio: 'https://api.example', zeno: 'https://api.example', sts: 'https://sts.example' },
+    });
+    render(
+        <UserSessionProvider>
+            <span>App</span>
+        </UserSessionProvider>,
+    );
+    await waitFor(() => expect(mocks.redirect).toHaveBeenCalledOnce());
+    expect(mocks.clear).toHaveBeenCalledOnce();
+    expect(window.location.hash).toBe('');
+    expect(mocks.exchange).not.toHaveBeenCalled();
+});

package/src/session/UserSessionProvider.tsx

@@ -65,7 +65,7 @@ interface UserSessionProviderProps {
     children: ReactNode | ReactNode[];
     loadOnboardingStatus?: boolean;
 }
-export function UserSessionProvider({ children, loadOnboardingStatus = true }: UserSessionProviderProps) {
+export function UserSessionProvider({ children, loadOnboardingStatus = false }: UserSessionProviderProps) {
     const hashParams = new URLSearchParams(location.hash.substring(1));
     const token = hashParams.get('token');
     const state = hashParams.get('state');
@@ -132,28 +132,6 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
             },
         });
 
-        if (usesGatewaySession() || usesAppOAuth()) {
-            let cancelled = false;
-            session.setSession = setSession;
-            const initialize = usesGatewaySession()
-                ? session.loginGatewaySession()
-                : getAppOAuthToken().then((token) => session.login(token, { loadOnboardingStatus: false }));
-            void initialize
-                .then(() => {
-                    if (!cancelled) setSession(session.clone());
-                })
-                .catch((error: unknown) => {
-                    if (cancelled) return;
-                    session.isLoading = false;
-                    session.authError = error instanceof Error ? error : new Error(String(error));
-                    setSession(session.clone());
-                });
-            return () => {
-                cancelled = true;
-                hasInitiatedAuthRef.current = false;
-            };
-        }
-
         if (Env.isLocalDev && Env.devAuthToken) {
             session.setSession = setSession;
             getComposableToken(selectedAccount, selectedProject, Env.devAuthToken)
@@ -177,6 +155,30 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
             return;
         }
 
+        if (usesGatewaySession() || usesAppOAuth()) {
+            let cancelled = false;
+            session.setSession = setSession;
+            const initialize = usesGatewaySession()
+                ? session.loginGatewaySession()
+                : getAppOAuthToken().then((token) =>
+                      session.login(token, { loadOnboardingStatus, authMethod: 'oauth' }),
+                  );
+            void initialize
+                .then(() => {
+                    if (!cancelled) setSession(session.clone());
+                })
+                .catch((error: unknown) => {
+                    if (cancelled || surfaceAuthError(error)) return;
+                    session.isLoading = false;
+                    session.authError = error instanceof Error ? error : new Error(String(error));
+                    setSession(session.clone());
+                });
+            return () => {
+                cancelled = true;
+                hasInitiatedAuthRef.current = false;
+            };
+        }
+
         if (token && state) {
             session.setSession = setSession;
             const validationError = verifyState(state);
@@ -187,7 +189,10 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
                         state: state,
                     },
                 });
+                clearState();
+                clearAuthHash();
                 redirectToCentralAuth({ accountId: selectedAccount, projectId: selectedProject });
+                return;
             } else {
                 clearState();
             }
@@ -217,6 +222,13 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
 
         const startFirebaseOrCentralAuth = () => {
             if (cancelled) return;
+            // A missing/expired host token must not upgrade an embedded app to a full user session.
+            if (window.parent !== window && !Env.allowLegacyIframeAuth) {
+                session.isLoading = false;
+                session.authError = new Error('Embedded authentication requires a valid token from the host.');
+                setSession(session.clone());
+                return;
+            }
 
             // If the current host is not in the Firebase allowlist, central auth owns sign-in.
             if (!session.isLoggedIn()) {

package/src/session/auth/auth-flow.md

@@ -191,8 +191,8 @@ The diagrams below use the default hostname; redirects use the selected broker.
 ┌──────────────────────┐    │ - Microsoft          │    ┌──────────────────────┐
 │ Build redirect URL:  │    └──────────┬───────────┘    │ Redirect to SSO      │
 │                      │               │                │ provider (Okta,      │
-│ auth.vertesia.io     │               ▼                │ Azure AD, etc.)      │
-│ .vertesia.app        │    ┌──────────────────────┐    └──────────┬───────────┘
+│ auth.vertesia.io      │               ▼                │ Azure AD, etc.)      │
+│                      │    ┌──────────────────────┐    └──────────┬───────────┘
 │ ?sts=...             │    │ Firebase OAuth       │               │
 │ &redirect_uri=...    │    │ redirect & return    │               ▼
 │ &state=...           │    └──────────┬───────────┘    ┌──────────────────────┐
@@ -484,8 +484,8 @@ The diagrams below use the default hostname; redirects use the selected broker.
                 │ Redirect to Central  │         │ getFirebaseAuth()    │
                 │ Auth for logout:     │         │   .signOut()         │
                 │                      │         │                      │
-                │ auth.vertesia.io     │         │ (Triggers            │
-                │  .vertesia.app       │         │  onAuthStateChanged  │
+                │ auth.vertesia.io      │         │ (Triggers            │
+                │                      │         │  onAuthStateChanged  │
                 │  /logout             │         │  with anonymous user)│
                 │                      │         └──────────┬───────────┘
                 │ (Central auth        │                    │
@@ -1103,4 +1103,17 @@ flowchart TB
         LO5 --> LO7
         LO6 --> LO7
         LO7 --> LO8 --> LO9
-    end
+    end
+## OAuth credential lifetime
+
+The short-lived access token and the ten-minute PKCE transaction are stored in tab-scoped
+sessionStorage. The state and verifier must survive the authorization redirect; the transaction is
+consumed once on return. Refresh credentials are held only in module memory, never browser storage.
+Reloading retains a valid access token; after it expires, a fresh broker round-trip is required.
+Logout revokes the in-memory refresh credential and clears both stored records. This does not make
+arbitrary scripts running on the application origin trusted: they share that origin's privileges.
+
+Embedded applications reacquire scoped credentials through the parent message protocol. A response
+without a token is a denial, and an already-expired `expiresAt` is rejected. JWT expiry governs the
+session cache; app-scoped tokens use a 60-second renewal window and are never exchanged for a broader
+session token just because their lifetime is shorter than a normal session's.

package/src/session/auth/authRoundTrip.ts

@@ -0,0 +1,24 @@
+const AUTH_ROUND_TRIP_COOKIE = 'vtsauth';
+const AUTH_ROUND_TRIP_TTL_SECONDS = 300;
+
+function authRoundTripCookie(value: string, maxAgeSeconds: number): string {
+    // Secure only over https: setting it on http://localhost would make the browser drop the
+    // cookie, and local development would silently lose the return-leg preloads.
+    const secure = window.location.protocol === 'https:' ? '; Secure' : '';
+    return `${AUTH_ROUND_TRIP_COOKIE}=${value}; Path=/; Max-Age=${maxAgeSeconds}; SameSite=Lax${secure}`;
+}
+
+/** Record that this browser is on its way to the broker. Called for you by {@link redirectToCentralAuth}. */
+export function markCentralAuthRoundTripStarted(): void {
+    // biome-ignore lint/suspicious/noDocumentCookie: CookieStore is async; this must land before location.replace()
+    document.cookie = authRoundTripCookie('1', AUTH_ROUND_TRIP_TTL_SECONDS);
+}
+
+/**
+ * Drop the marker. An app calls this once it is actually rendering, so that its *next* cold load is
+ * recognized as an outgoing leg again and does not preload an application it is about to discard.
+ */
+export function clearCentralAuthRoundTripMarker(): void {
+    // biome-ignore lint/suspicious/noDocumentCookie: pairs with the write above; see that comment.
+    document.cookie = authRoundTripCookie('', 0);
+}

package/src/session/auth/composable.test.ts

@@ -38,7 +38,7 @@ describe('getComposableToken', () => {
         vi.clearAllMocks();
     });
 
-    it('uses an authorization-bearing STS-issued Vertesia token directly instead of exchanging it', async () => {
+    it.each([false, true])('uses an authorization-bearing STS token directly (branch=%s)', async (branch) => {
         const token = makeJwt({
             iss: 'https://sts.dev1.vertesia.io',
             exp: Math.floor(Date.now() / 1000) + 3600,
@@ -51,6 +51,10 @@ describe('getComposableToken', () => {
         vi.stubGlobal('fetch', fetchMock);
 
         const { getComposableToken } = await importComposableAuth();
+        if (branch) {
+            const { Env } = await import('@vertesia/ui/env');
+            Env.endpoints.sts = 'https://token-server-dev-example.api.dev1.vertesia.io';
+        }
         const result = await getComposableToken('account-id', 'project-id', token, false, true);
 
         expect(result.rawToken).toBe(token);
@@ -85,6 +89,24 @@ describe('getComposableToken', () => {
         expect(fetchMock).not.toHaveBeenCalled();
     });
 
+    it('uses a short-lived scoped iframe token directly, including a forced host refresh', async () => {
+        const token = makeJwt({
+            iss: 'https://sts.dev1.vertesia.io',
+            exp: Math.floor(Date.now() / 1000) + 120,
+            client_id: 'vertesia-app:analytics',
+            account: { id: 'account-id' },
+            project: { id: 'project-id' },
+            apps: ['analytics'],
+        });
+        const provider = vi.fn(async () => token);
+        const fetcher = vi.fn();
+        vi.stubGlobal('fetch', fetcher);
+        const { getComposableToken } = await importComposableAuth(provider);
+        expect((await getComposableToken('account-id', 'project-id', undefined, true, true)).rawToken).toBe(token);
+        expect(provider).toHaveBeenCalledOnce();
+        expect(fetcher).not.toHaveBeenCalled();
+    });
+
     it('falls back to the cached credential when the injected provider is unavailable', async () => {
         const expiringToken = makeJwt({
             iss: 'https://sts.dev1.vertesia.io',

package/src/session/auth/composable.ts

@@ -18,6 +18,7 @@ import {
     shouldRedirectToCentralAuth,
 } from './domainRouting';
 import { getFirebaseAuth, getFirebaseAuthToken } from './firebase';
+import { isStsTokenIssuer } from './tokenIssuer';
 
 let AUTH_TOKEN_RAW: string | undefined;
 let AUTH_TOKEN: AuthTokenPayload | undefined;
@@ -150,10 +151,6 @@ export function resolveAuthSelection(currentUrl: URL): { accountId?: string; pro
     return { accountId, projectId };
 }
 
-function normalizeIssuer(value: string | undefined): string | undefined {
-    return value?.replace(/\/+$/, '');
-}
-
 function decodeToken(token: string): AuthTokenPayload {
     return jwtDecode(token) as AuthTokenPayload;
 }
@@ -162,7 +159,7 @@ function isVertesiaIssuedToken(token: string | undefined): token is string {
     if (!token) return false;
     try {
         const decoded = decodeToken(token) as AuthTokenPayload & { iss?: string };
-        return normalizeIssuer(decoded.iss) === normalizeIssuer(Env.endpoints.sts);
+        return isStsTokenIssuer(decoded.iss, Env.endpoints.sts);
     } catch {
         return false;
     }
@@ -170,7 +167,11 @@ function isVertesiaIssuedToken(token: string | undefined): token is string {
 
 function canUseVertesiaTokenDirectly(token: string, accountId?: string, projectId?: string): boolean {
     const decoded = decodeToken(token);
-    if (!decoded.exp || decoded.exp <= Date.now() / 1000 + 300) {
+    const appSession =
+        'client_id' in decoded &&
+        typeof decoded.client_id === 'string' &&
+        decoded.client_id.startsWith('vertesia-app:');
+    if (!decoded.exp || decoded.exp <= Date.now() / 1000 + (appSession ? 60 : 300)) {
         return false;
     }
     const hasAuthorizationClaims = Boolean(
@@ -537,7 +538,8 @@ export async function getComposableToken(
             AUTH_TOKEN_RAW = await fetchComposableTokenFromFirebaseToken(selectedAccount, selectedProject);
         } else if (!devAuthToken) {
             // Embedded apps can reacquire a fresh credential from their host after their cached token expires.
-            const refreshCredential = (await Env.authTokenProvider?.()) ?? initToken ?? AUTH_TOKEN_RAW;
+            const providerCredential = await Env.authTokenProvider?.();
+            const refreshCredential = providerCredential ?? initToken ?? AUTH_TOKEN_RAW;
             // `forceRefresh` has to defeat this shortcut, not just the cache above it. A caller
             // asking for a forced refresh wants claims recomputed -- `refreshAuthToken()` exists so
             // a stale `apps` claim can be re-read after an ACE change, and STS recomputes it on
@@ -545,7 +547,7 @@ export async function getComposableToken(
             // returns the very token whose claims were suspect, silently making the call a no-op
             // for exactly the sessions that have no other credential to fall back on.
             if (
-                !forceRefresh &&
+                (!forceRefresh || !!providerCredential) &&
                 refreshCredential &&
                 isVertesiaIssuedToken(refreshCredential) &&
                 canUseVertesiaTokenDirectly(refreshCredential, selectedAccount, selectedProject)

package/src/session/auth/domainRouting.ts

@@ -1,3 +1,7 @@
+import { markCentralAuthRoundTripStarted } from './authRoundTrip';
+
+export { clearCentralAuthRoundTripMarker, markCentralAuthRoundTripStarted } from './authRoundTrip';
+
 import { Env } from '@vertesia/ui/env';
 import { generateAuthState } from './authState';
 import { gatewayLoginUrl, usesGatewaySession } from './gateway';
@@ -114,31 +118,6 @@ export function buildCentralAuthRedirectUrl(
  * The TTL bounds the cost of the case where the app never mounts (the visitor abandons the login
  * screen): after it lapses, cold loads are back to withholding the application preloads.
  */
-const AUTH_ROUND_TRIP_COOKIE = 'vtsauth';
-const AUTH_ROUND_TRIP_TTL_SECONDS = 300;
-
-function authRoundTripCookie(value: string, maxAgeSeconds: number): string {
-    // Secure only over https: setting it on http://localhost would make the browser drop the
-    // cookie, and local development would silently lose the return-leg preloads.
-    const secure = window.location.protocol === 'https:' ? '; Secure' : '';
-    return `${AUTH_ROUND_TRIP_COOKIE}=${value}; Path=/; Max-Age=${maxAgeSeconds}; SameSite=Lax${secure}`;
-}
-
-/** Record that this browser is on its way to the broker. Called for you by {@link redirectToCentralAuth}. */
-export function markCentralAuthRoundTripStarted(): void {
-    // biome-ignore lint/suspicious/noDocumentCookie: CookieStore is async; this must land before location.replace()
-    document.cookie = authRoundTripCookie('1', AUTH_ROUND_TRIP_TTL_SECONDS);
-}
-
-/**
- * Drop the marker. An app calls this once it is actually rendering, so that its *next* cold load is
- * recognized as an outgoing leg again and does not preload an application it is about to discard.
- */
-export function clearCentralAuthRoundTripMarker(): void {
-    // biome-ignore lint/suspicious/noDocumentCookie: pairs with the write above; see that comment.
-    document.cookie = authRoundTripCookie('', 0);
-}
-
 /**
  * Start a Central Auth round-trip for the current page.
  *