@vertesia/ui 1.5.0-dev.20260807.073259Z → 1.5.0-dev.20260826.064249Z

package/src/i18n/rtl.test.ts

@@ -1,6 +1,9 @@
+import { readdirSync, readFileSync } from 'node:fs';
+import { dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
 import i18next from 'i18next';
 import { describe, expect, it } from 'vitest';
-import { i18nInstance, NAMESPACE } from './instance.js';
+import { AVAILABLE_LOCALES, NAMESPACE } from './instance.js';
 import { isRTL, RTL_LANGUAGES, resolveLanguage, SUPPORTED_LANGUAGES } from './rtl.js';
 
 describe('isRTL', () => {
@@ -67,10 +70,10 @@ describe('RTL_LANGUAGES set', () => {
 });
 
 describe('SUPPORTED_LANGUAGES divergence guard', () => {
-    it('matches exactly the locales registered in i18nInstance.options.resources', () => {
-        const registered = Object.keys(i18nInstance.options.resources ?? {}).sort();
+    it('matches exactly the locales the i18n instance can serve', () => {
+        const available = [...AVAILABLE_LOCALES].sort();
         const supported = [...SUPPORTED_LANGUAGES].sort();
-        expect(registered).toEqual(supported);
+        expect(available).toEqual(supported);
     });
 });
 
@@ -95,8 +98,10 @@ describe('empty translation fallback', () => {
         expect(t('test.emptyTranslationFallback')).toBe('English fallback');
     });
 
+    // Reads the locale files rather than `i18nInstance.options.resources`: only the `en` fallback is
+    // bundled there now, the rest are fetched on demand.
     it('does not ship parser-created empty locale entries', () => {
-        const resources = i18nInstance.options.resources ?? {};
+        const localesDir = join(dirname(fileURLToPath(import.meta.url)), 'locales');
         const emptyEntries: string[] = [];
 
         const collectEmptyEntries = (value: unknown, path: string[]) => {
@@ -121,8 +126,12 @@ describe('empty translation fallback', () => {
             }
         };
 
-        for (const [locale, resource] of Object.entries(resources)) {
-            collectEmptyEntries(resource, [locale]);
+        const localeFiles = readdirSync(localesDir).filter((name) => name.endsWith('.json'));
+        expect(localeFiles.length).toBe(SUPPORTED_LANGUAGES.length);
+
+        for (const file of localeFiles) {
+            const resource: unknown = JSON.parse(readFileSync(join(localesDir, file), 'utf-8'));
+            collectEmptyEntries(resource, [file.replace(/\.json$/, '')]);
         }
 
         expect(emptyEntries).toEqual([]);

package/src/rich-text/VertesiaRichTextEditor.test.tsx

@@ -1,7 +1,12 @@
 /** @vitest-environment jsdom */
 
 import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { MarkdownRichTextEditor, type MarkdownRichTextEditorProps, setEditorMarkdown } from '@vertesia/rich-text';
+import {
+    DOCUMENT_EDITOR_CHANGE_DEBOUNCE_MS,
+    MarkdownRichTextEditor,
+    type MarkdownRichTextEditorProps,
+    setEditorMarkdown,
+} from '@vertesia/rich-text';
 import { describe, expect, it, vi } from 'vitest';
 import { I18nProvider } from '../i18n/index.js';
 import {
@@ -174,6 +179,33 @@ describe('VertesiaMarkdownRichTextEditor', () => {
         expect(await screen.findByRole('heading', { name: 'Setext heading' })).not.toBeNull();
         expect(screen.getByRole('textbox', { name: 'Markdown document editor' })).not.toBeNull();
         expect(screen.queryByRole('heading', { name: 'Some Markdown formatting may change' })).toBeNull();
+        // The document editor debounces serialization, so wait past that window: otherwise this
+        // assertion passes merely because a spurious change has not been flushed yet.
+        await new Promise((resolve) => setTimeout(resolve, DOCUMENT_EDITOR_CHANGE_DEBOUNCE_MS * 2));
+        expect(onChange).not.toHaveBeenCalled();
+    });
+
+    it('does not report a change when the document is locked or unlocked', async () => {
+        const onChange = vi.fn();
+        const renderEditable = (editable: boolean) => (
+            <I18nProvider lng="en">
+                <VertesiaMarkdownDocumentEditor
+                    value={'Setext heading\n=============='}
+                    onChange={onChange}
+                    editable={editable}
+                />
+            </I18nProvider>
+        );
+        const view = render(renderEditable(true));
+
+        expect(await screen.findByRole('heading', { name: 'Setext heading' })).not.toBeNull();
+        // Both directions matter: either toggle emits an editor update on its own.
+        view.rerender(renderEditable(false));
+        await new Promise((resolve) => setTimeout(resolve, DOCUMENT_EDITOR_CHANGE_DEBOUNCE_MS * 2));
+        expect(onChange).not.toHaveBeenCalled();
+
+        view.rerender(renderEditable(true));
+        await new Promise((resolve) => setTimeout(resolve, DOCUMENT_EDITOR_CHANGE_DEBOUNCE_MS * 2));
         expect(onChange).not.toHaveBeenCalled();
     });
 

package/src/session/UserSessionProvider.tsx

@@ -123,18 +123,15 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
     authFlowRef.current = () => {
         // Make this effect idempotent - only run auth flow once
         if (hasInitiatedAuthRef.current) {
-            console.log('Auth: skipping duplicate auth flow initiation');
+            Env.logger.debug('Skipping duplicate auth flow initiation');
             return;
         }
         hasInitiatedAuthRef.current = true;
 
-        console.log('Auth: starting auth flow');
-        Env.logger.info('Starting auth flow');
+        Env.logger.debug('Starting auth flow');
         const currentUrl = new URL(window.location.href);
         const { accountId: selectedAccount, projectId: selectedProject } = resolveAuthSelection(currentUrl);
-        console.log('Auth: selected account', selectedAccount);
-        console.log('Auth: selected project', selectedProject);
-        Env.logger.info('Selected account and project', {
+        Env.logger.debug('Selected account and project', {
             vertesia: {
                 account_id: selectedAccount,
                 project_id: selectedProject,
@@ -207,20 +204,14 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
 
             // If the current host is not in the Firebase allowlist, central auth owns sign-in.
             if (!session.isLoggedIn()) {
-                console.log('Auth: not logged in & no token/state');
-                Env.logger.info('Not logged in & no token/state', {
+                Env.logger.debug('Not logged in & no token/state', {
                     vertesia: {
                         account_id: selectedAccount,
                         project_id: selectedProject,
                     },
                 });
                 if (shouldRedirectToCentralAuth()) {
-                    console.log(
-                        'Auth: host is not in Firebase auth allowlist, redirecting to central auth with selection',
-                        selectedAccount,
-                        selectedProject,
-                    );
-                    Env.logger.info('Redirecting to central auth with selection', {
+                    Env.logger.debug('Redirecting to central auth with selection', {
                         vertesia: {
                             account_id: selectedAccount,
                             project_id: selectedProject,
@@ -230,8 +221,7 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
                     return; // Don't register onAuthStateChanged listener when redirecting
                 }
 
-                console.log('Auth: host is in Firebase auth allowlist');
-                Env.logger.info('Host is in Firebase auth allowlist', {
+                Env.logger.debug('Host is in Firebase auth allowlist', {
                     vertesia: {
                         account_id: selectedAccount,
                         project_id: selectedProject,
@@ -241,8 +231,7 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
 
             unsubscribe = onAuthStateChanged(getFirebaseAuth(), async (firebaseUser) => {
                 if (firebaseUser) {
-                    console.log('Auth: successful login with firebase');
-                    Env.logger.info('Successful login with firebase', {
+                    Env.logger.debug('Successful login with firebase', {
                         vertesia: {
                             account_id: selectedAccount,
                             project_id: selectedProject,
@@ -274,8 +263,7 @@ export function UserSessionProvider({ children, loadOnboardingStatus = true }: U
                         });
                 } else {
                     // anonymous user
-                    console.log('Auth: using anonymous user');
-                    Env.logger.info('Using anonymous user', {
+                    Env.logger.debug('Using anonymous user', {
                         vertesia: {
                             account_id: selectedAccount,
                             project_id: selectedProject,

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

@@ -1,7 +1,7 @@
 // @vitest-environment jsdom
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
-const logger = { info: vi.fn(), warn: vi.fn(), error: vi.fn() };
+const logger = { debug: vi.fn(), info: vi.fn(), warn: vi.fn(), error: vi.fn() };
 
 vi.mock('@vertesia/ui/env', () => ({
     Env: {

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

@@ -5,7 +5,7 @@ function makeJwt(payload: Record<string, unknown>) {
     return `${encode({ alg: 'ES256', typ: 'JWT' })}.${encode(payload)}.signature`;
 }
 
-async function importComposableAuth() {
+async function importComposableAuth(authTokenProvider?: () => Promise<string | undefined>) {
     vi.resetModules();
     const [{ Env }, composableAuth] = await Promise.all([import('@vertesia/ui/env'), import('./composable')]);
     Env.init({
@@ -19,6 +19,7 @@ async function importComposableAuth() {
             zeno: 'https://zeno-server-dev-feat-appgen.api.dev1.vertesia.io',
             sts: 'https://sts.dev1.vertesia.io',
         },
+        authTokenProvider,
     });
     return composableAuth;
 }
@@ -53,6 +54,65 @@ describe('getComposableToken', () => {
         expect(fetchMock).not.toHaveBeenCalled();
     });
 
+    it('reacquires a fresh injected token instead of reusing an expired cached credential', async () => {
+        const expiredToken = makeJwt({
+            iss: 'https://sts.dev1.vertesia.io',
+            exp: Math.floor(Date.now() / 1000) - 60,
+            account: { id: 'account-id', name: 'Account' },
+            project: { id: 'project-id', name: 'Project', account: 'account-id' },
+            project_roles: ['developer'],
+        });
+        const freshToken = makeJwt({
+            iss: 'https://sts.dev1.vertesia.io',
+            exp: Math.floor(Date.now() / 1000) + 3600,
+            account: { id: 'account-id', name: 'Account' },
+            project: { id: 'project-id', name: 'Project', account: 'account-id' },
+            project_roles: ['developer'],
+        });
+        const authTokenProvider = vi.fn(() => Promise.resolve(freshToken));
+        const fetchMock = vi.fn();
+        vi.stubGlobal('fetch', fetchMock);
+
+        const { getComposableToken } = await importComposableAuth(authTokenProvider);
+        const result = await getComposableToken('account-id', 'project-id', expiredToken, false, true);
+
+        expect(result.rawToken).toBe(freshToken);
+        expect(authTokenProvider).toHaveBeenCalledOnce();
+        expect(fetchMock).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',
+            exp: Math.floor(Date.now() / 1000) + 60,
+            account: { id: 'account-id', name: 'Account' },
+            project: { id: 'project-id', name: 'Project', account: 'account-id' },
+            project_roles: ['developer'],
+        });
+        const refreshedToken = makeJwt({
+            iss: 'https://sts.dev1.vertesia.io',
+            exp: Math.floor(Date.now() / 1000) + 3600,
+            account: { id: 'account-id', name: 'Account' },
+            project: { id: 'project-id', name: 'Project', account: 'account-id' },
+            project_roles: ['developer'],
+        });
+        const authTokenProvider = vi.fn(() => Promise.resolve(undefined));
+        const fetchMock = vi.fn().mockResolvedValue({
+            ok: true,
+            status: 200,
+            json: () => Promise.resolve({ token: refreshedToken }),
+        });
+        vi.stubGlobal('fetch', fetchMock);
+
+        const { getComposableToken } = await importComposableAuth(authTokenProvider);
+        const result = await getComposableToken('account-id', 'project-id', expiringToken, false, true);
+
+        expect(result.rawToken).toBe(refreshedToken);
+        expect(authTokenProvider).toHaveBeenCalledOnce();
+        expect(fetchMock).toHaveBeenCalledOnce();
+        expect(fetchMock.mock.calls[0]?.[1]?.headers).toMatchObject({ Authorization: `Bearer ${expiringToken}` });
+    });
+
     it('exchanges a bare STS-issued Vertesia token so roles can be hydrated', async () => {
         const sourceToken = makeJwt({
             iss: 'https://sts.dev1.vertesia.io',

package/src/session/auth/composable.ts

@@ -92,6 +92,9 @@ 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) {
+        return false;
+    }
     const hasAuthorizationClaims = Boolean(
         decoded.permissions?.length ||
             decoded.account_roles?.length ||
@@ -117,8 +120,7 @@ export async function fetchComposableToken(
     ttl?: number,
     retryCount = 0,
 ): Promise<string> {
-    console.log(`Getting/refreshing composable token for account ${accountId} and project ${projectId} `);
-    Env.logger.info('Getting/refreshing composable token', {
+    Env.logger.debug('Getting/refreshing composable token', {
         vertesia: {
             account_id: accountId,
             project_id: projectId,
@@ -128,14 +130,12 @@ export async function fetchComposableToken(
 
     const idToken = await getIdToken(); //get from firebase
     if (!idToken) {
-        console.log('No id token found - using cookie auth');
         throw new Error('No id token found');
     }
 
     // Use STS endpoint - either configured or default to sts.vertesia.io
     const stsEndpoint = Env.endpoints.sts;
-    console.log('Using STS for token generation:', stsEndpoint);
-    Env.logger.info('Using STS for token generation', {
+    Env.logger.debug('Using STS for token generation', {
         vertesia: {
             account_id: accountId,
             project_id: projectId,
@@ -176,8 +176,7 @@ export async function fetchComposableToken(
 
         if (idToken && stsRes?.status === 404) {
             // User not found in token-server - call ensure-user endpoint
-            console.log('404: User not found - calling ensure-user endpoint');
-            Env.logger.info('404: User not found - calling ensure-user endpoint', {
+            Env.logger.debug('404: User not found - calling ensure-user endpoint', {
                 vertesia: {
                     account_id: accountId,
                     project_id: projectId,
@@ -195,8 +194,7 @@ export async function fetchComposableToken(
 
             if (ensureResponse.status === 412) {
                 // No invite - trigger signup
-                console.log('412: No invite found - signup required');
-                Env.logger.info('412: No invite found - signup required', {
+                Env.logger.debug('412: No invite found - signup required', {
                     vertesia: {
                         account_id: accountId,
                         project_id: projectId,
@@ -234,8 +232,7 @@ export async function fetchComposableToken(
             }
 
             // User created/exists - retry token generation
-            console.log('User ensured - retrying token generation');
-            Env.logger.info('User ensured - retrying token generation', {
+            Env.logger.debug('User ensured - retrying token generation', {
                 vertesia: {
                     account_id: accountId,
                     project_id: projectId,
@@ -245,8 +242,7 @@ export async function fetchComposableToken(
         }
 
         if (idToken && stsRes?.status === 412) {
-            console.log("412: auth succeeded but user doesn't exist - signup required", stsRes?.status);
-            Env.logger.error("412: auth succeeded but user doesn't exist - signup required", {
+            Env.logger.info("412: auth succeeded but user doesn't exist - signup required", {
                 vertesia: {
                     account_id: accountId,
                     project_id: projectId,
@@ -258,7 +254,7 @@ export async function fetchComposableToken(
                 Env.logger.error('No email found in id token');
                 throw new Error('No email found in id token');
             }
-            Env.logger.error('User not found', {
+            Env.logger.info('User not found', {
                 vertesia: {
                     account_id: accountId,
                     project_id: projectId,
@@ -354,8 +350,7 @@ export async function fetchComposableToken(
         }
 
         const { token } = await stsRes.json();
-        console.log('Successfully got token from STS');
-        Env.logger.info('Successfully got token from STS');
+        Env.logger.debug('Successfully got token from STS');
         return token;
     } catch (error) {
         if (
@@ -460,13 +455,24 @@ export async function getComposableToken(
         if (!devAuthToken && !useInternalAuth && getFirebaseAuth().currentUser) {
             //we have a firebase user, get the token from there
             AUTH_TOKEN_RAW = await fetchComposableTokenFromFirebaseToken(selectedAccount, selectedProject);
-        } else if (!devAuthToken && (initToken || AUTH_TOKEN_RAW)) {
-            // we have a token already and no firebase user, refresh it
-            AUTH_TOKEN_RAW = await fetchComposableToken(
-                () => Promise.resolve(initToken ?? AUTH_TOKEN_RAW),
-                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;
+            if (
+                refreshCredential &&
+                isVertesiaIssuedToken(refreshCredential) &&
+                canUseVertesiaTokenDirectly(refreshCredential, selectedAccount, selectedProject)
+            ) {
+                AUTH_TOKEN_RAW = refreshCredential;
+            } else if (refreshCredential) {
+                AUTH_TOKEN_RAW = await fetchComposableToken(
+                    () => Promise.resolve(refreshCredential),
+                    selectedAccount,
+                    selectedProject,
+                );
+            } else {
+                AUTH_TOKEN_RAW = undefined;
+            }
         } else if (devAuthToken) {
             AUTH_TOKEN_RAW = devAuthToken;
         }

package/src/session/auth/firebase.ts

@@ -139,7 +139,7 @@ export async function getFirebaseAuthToken(refresh?: boolean) {
         return user
             .getIdToken(refresh)
             .then((token) => {
-                Env.logger.info('Got Firebase token', {
+                Env.logger.debug('Got Firebase token', {
                     vertesia: {
                         user_email: user.email,
                         user_name: user.displayName,

package/src/shell/VertesiaShell.tsx

@@ -3,6 +3,7 @@ import { TypeRegistryProvider, UserPermissionProvider } from '@vertesia/ui/featu
 import { LanguageBoundI18nProvider, LanguageProvider, type SupportedLanguage } from '@vertesia/ui/i18n';
 import { DevSessionProvider, UserSessionProvider } from '@vertesia/ui/session';
 import type { ReactNode } from 'react';
+import { IframeAppContextSync } from './apps/IframeAppContextSync.js';
 import { SigninScreen } from './login/SigninScreen';
 import { SplashScreen } from './SplashScreen';
 
@@ -35,6 +36,7 @@ export function VertesiaShell({
             <ThemeProvider defaultTheme="system" storageKey="vite-ui-theme">
                 <LanguageProvider defaultLanguage={defaultLanguage}>
                     <LanguageBoundI18nProvider>
+                        <IframeAppContextSync />
                         {!authToken && (
                             <>
                                 <SplashScreen icon={loadingIcon} />

package/src/shell/apps/IframeAppContextSync.test.tsx

@@ -0,0 +1,196 @@
+// @vitest-environment jsdom
+
+import { act, cleanup, render, screen, waitFor } from '@testing-library/react';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { ThemeProvider, useTheme } from '../../core/index.js';
+import { LanguageProvider, useLanguage } from '../../i18n/index.js';
+import { IframeAppContextSync } from './IframeAppContextSync.js';
+import {
+    IFRAME_APP_CONTEXT,
+    IFRAME_APP_CONTEXT_REQUEST,
+    IFRAME_APP_HOST_ORIGIN_PARAM,
+    IFRAME_APP_LOCATION_CHANGE,
+    IFRAME_APP_NAVIGATE,
+} from './iframe-auth.js';
+
+const originalParent = Object.getOwnPropertyDescriptor(window, 'parent');
+const originalReferrer = Object.getOwnPropertyDescriptor(document, 'referrer');
+
+afterEach(() => {
+    cleanup();
+    window.history.replaceState(null, '', '/');
+    localStorage.clear();
+    sessionStorage.clear();
+    document.documentElement.classList.remove('light', 'dark');
+    if (originalParent) Object.defineProperty(window, 'parent', originalParent);
+    else Reflect.deleteProperty(window, 'parent');
+    if (originalReferrer) Object.defineProperty(document, 'referrer', originalReferrer);
+    else Reflect.deleteProperty(document, 'referrer');
+});
+
+function ContextProbe() {
+    const { theme } = useTheme();
+    const { language } = useLanguage();
+    return <div>{`${theme}:${language}`}</div>;
+}
+
+describe('IframeAppContextSync', () => {
+    it('requests and applies host presentation state without overwriting standalone preferences', async () => {
+        const postMessage = vi.fn();
+        const parentWindow = { postMessage } as unknown as Window;
+        Object.defineProperty(window, 'parent', { configurable: true, value: parentWindow });
+        Object.defineProperty(document, 'referrer', {
+            configurable: true,
+            value: 'https://cloud.vertesia.io/app/sample',
+        });
+        localStorage.setItem('custom-theme', 'dark');
+        localStorage.setItem('custom-language', 'en');
+
+        render(
+            <ThemeProvider storageKey="custom-theme">
+                <LanguageProvider storageKey="custom-language">
+                    <IframeAppContextSync />
+                    <ContextProbe />
+                </LanguageProvider>
+            </ThemeProvider>,
+        );
+
+        expect(parentWindow.postMessage).toHaveBeenCalledWith(
+            { type: IFRAME_APP_CONTEXT_REQUEST },
+            'https://cloud.vertesia.io',
+        );
+
+        window.dispatchEvent(
+            new MessageEvent('message', {
+                data: { type: IFRAME_APP_CONTEXT, theme: 'light', language: 'fr' },
+                origin: 'https://attacker.example.com',
+                source: parentWindow,
+            }),
+        );
+        expect(screen.getByText('dark:en')).toBeTruthy();
+
+        act(() => {
+            window.dispatchEvent(
+                new MessageEvent('message', {
+                    data: { type: IFRAME_APP_CONTEXT, theme: 'light', language: 'fr' },
+                    origin: 'https://cloud.vertesia.io',
+                    source: parentWindow,
+                }),
+            );
+        });
+
+        await waitFor(() => expect(screen.getByText('light:fr')).toBeTruthy());
+        expect(localStorage.getItem('custom-theme')).toBe('dark');
+        expect(localStorage.getItem('custom-language')).toBe('en');
+        expect(postMessage.mock.calls.filter(([message]) => message.type === IFRAME_APP_CONTEXT_REQUEST)).toHaveLength(
+            1,
+        );
+    });
+
+    it('applies same-origin host navigation without reloading the document', () => {
+        const parentWindow = { postMessage: vi.fn() } as unknown as Window;
+        Object.defineProperty(window, 'parent', { configurable: true, value: parentWindow });
+        Object.defineProperty(document, 'referrer', {
+            configurable: true,
+            value: 'https://cloud.vertesia.io/app/sample',
+        });
+        localStorage.setItem('vite-ui-theme', 'dark');
+        localStorage.setItem('vertesia-ui-language', 'en');
+        window.history.replaceState(null, '', '/app/');
+        const popstate = vi.fn();
+        window.addEventListener('popstate', popstate);
+
+        render(
+            <ThemeProvider>
+                <LanguageProvider>
+                    <IframeAppContextSync />
+                </LanguageProvider>
+            </ThemeProvider>,
+        );
+
+        window.dispatchEvent(
+            new MessageEvent('message', {
+                data: { type: IFRAME_APP_NAVIGATE, url: 'https://attacker.example.com/stolen' },
+                origin: 'https://cloud.vertesia.io',
+                source: parentWindow,
+            }),
+        );
+        expect(window.location.pathname).toBe('/app/');
+
+        const target = `${window.location.origin}/app/reports?__vertesia_slot=content`;
+        window.dispatchEvent(
+            new MessageEvent('message', {
+                data: { type: IFRAME_APP_NAVIGATE, url: target },
+                origin: 'https://cloud.vertesia.io',
+                source: parentWindow,
+            }),
+        );
+
+        expect(window.location.pathname).toBe('/app/reports');
+        expect(window.location.search).toBe('?__vertesia_slot=content');
+        expect(popstate).toHaveBeenCalledTimes(1);
+        window.removeEventListener('popstate', popstate);
+    });
+
+    it('acknowledges host navigation when the iframe is already at the requested URL', () => {
+        const parentWindow = { postMessage: vi.fn() } as unknown as Window;
+        Object.defineProperty(window, 'parent', { configurable: true, value: parentWindow });
+        localStorage.setItem('vite-ui-theme', 'dark');
+        window.history.replaceState(
+            null,
+            '',
+            `/app/reports?${IFRAME_APP_HOST_ORIGIN_PARAM}=https%3A%2F%2Fcloud.vertesia.io`,
+        );
+
+        render(
+            <ThemeProvider>
+                <LanguageProvider>
+                    <IframeAppContextSync />
+                </LanguageProvider>
+            </ThemeProvider>,
+        );
+        parentWindow.postMessage = vi.fn();
+
+        window.dispatchEvent(
+            new MessageEvent('message', {
+                data: { type: IFRAME_APP_NAVIGATE, url: window.location.href },
+                origin: 'https://cloud.vertesia.io',
+                source: parentWindow,
+            }),
+        );
+
+        expect(parentWindow.postMessage).toHaveBeenCalledWith(
+            { type: IFRAME_APP_LOCATION_CHANGE, url: window.location.href },
+            'https://cloud.vertesia.io',
+        );
+    });
+
+    it('reports app-initiated history navigation to the embedding Studio', () => {
+        const parentWindow = { postMessage: vi.fn() } as unknown as Window;
+        Object.defineProperty(window, 'parent', { configurable: true, value: parentWindow });
+        window.history.replaceState(null, '', `/app/?${IFRAME_APP_HOST_ORIGIN_PARAM}=https%3A%2F%2Fcloud.vertesia.io`);
+        localStorage.setItem('vite-ui-theme', 'dark');
+        localStorage.setItem('vertesia-ui-language', 'en');
+
+        render(
+            <ThemeProvider>
+                <LanguageProvider>
+                    <IframeAppContextSync />
+                </LanguageProvider>
+            </ThemeProvider>,
+        );
+        parentWindow.postMessage = vi.fn();
+
+        window.history.pushState(null, '', '/app/reports?period=week');
+
+        expect(parentWindow.postMessage).toHaveBeenCalledWith(
+            {
+                type: IFRAME_APP_LOCATION_CHANGE,
+                url:
+                    `${window.location.origin}/app/reports?period=week&` +
+                    `${IFRAME_APP_HOST_ORIGIN_PARAM}=https%3A%2F%2Fcloud.vertesia.io`,
+            },
+            'https://cloud.vertesia.io',
+        );
+    });
+});