Embedded apps show blank page on Chrome 145 direct page loads

[uurcank]

Description

Embedded apps show a blank/white page in Chrome 145 when navigating directly to an app page via URL (e.g., admin.shopify.com/store/{shop}/apps/{app}/analytics). Sidebar navigation clicks work fine — only direct page loads are affected.

This issue is not app-specific — I've confirmed the same behavior across multiple third-party Shopify apps from different companies.

Safari works correctly for both direct page loads and sidebar navigation.

Environment

• Chrome: Version 145.0.7632.160 (Official Build) (arm64)
• Safari: Works correctly
• Cookie setting: "Block third-party cookies" (recommended by Shopify)
• App Bridge: CDN version (cdn.shopify.com/shopifycloud/app-bridge.js)

Console Output

Chrome DevTools shows a massive React re-render loop in Shopify admin's own render-common bundle, preceded by this CSP warning:

The Content Security Policy directive 'upgrade-insecure-requests' is ignored when delivered in a report-only policy.

This warning repeats hundreds of times via render-common-a91c47232eed.js:25, with the call stack showing an infinite Pj → Lo → Pj → Lo React reconciliation loop.

Steps to Reproduce

1. Open Chrome 145 with "Block third-party cookies" enabled
2. Navigate directly to any embedded app page via URL bar: https://admin.shopify.com/store/{shop}/apps/{app}/{page}
3. Page shows blank/white — the iframe never renders
4. Open DevTools Console — see the upgrade-insecure-requests + render-common re-render loop
5. Now click a sidebar navigation link to the same page — it loads correctly

Expected Behavior

Direct page loads should render the embedded app iframe, same as sidebar navigation clicks.

Analysis

The upgrade-insecure-requests directive is being sent inside a Content-Security-Policy-Report-Only header from the Shopify admin shell. Per the CSP spec, upgrade-insecure-requests is an action directive that is meaningless in report-only mode. Chrome 145 warns about this, which appears to trigger the React re-render loop in the admin shell's render-common bundle.

The embedded app's own response headers are correct:

• content-security-policy: frame-ancestors https://{shop}.myshopify.com https://admin.shopify.com
• No X-Frame-Options header
• Response status: 200 OK

The issue is in the parent frame (Shopify admin shell), not in the embedded app's iframe response.

[MalikaImamovic]

For reference, once throttling was enabled, our apps started loading successfully.

[FBosler]

We have the same issue. Throttling down in Google Chrome to "Slow 4G" worked

[biirus]

The same. Safari works fine, but infinite loading for Chrome.

[FBosler]

Reproducing the same issue — additional debugging details

We're seeing the exact same behavior with our production embedded app (Next.js on Vercel, Pages Router, App Bridge CDN).

Symptoms

• Direct links broken in Chrome: Navigating to admin.shopify.com/store/{shop}/apps/{app}/{page} shows a blank page. The iframe request to our app domain is cancelled by Chrome before our serverless function
  ever executes.
• Sidebar navigation works fine: Clicking through the Shopify admin sidebar into the app works every time.
• Safari unaffected: Both direct links and sidebar navigation work 100% of the time in Safari.
• Intermittent: Fails roughly 14 out of 15 attempts on fast connections.
• Started suddenly: Worked fine the day before with no code changes on our side.

Debugging findings

We traced the request through Chrome DevTools (Network tab, Preserve Log enabled):

1. Chrome sends the iframe request to our app with all correct parameters (embedded=1, id_token, shop, hmac, etc.)
2. The request reaches Vercel's edge routing — we see server: Vercel and x-vercel-id in partial response headers
3. The request is then cancelled before our serverless function executes — no Vercel function logs, no response status code, no response body, no content-type header
4. No console errors whatsoever — no CSP violations, no React errors, nothing

Our app's response headers are correct:
content-security-policy: frame-ancestors https://{shop}.myshopify.com https://admin.shopify.com;

Key finding: Works with network throttling

When throttling Chrome to 3G, direct links work reliably. This strongly suggests a race condition in the Shopify admin's initial page render — likely the iframe being removed/recreated from the DOM during the admin shell's React render cycle. Slowing down the network changes the timing enough to avoid the race.

Reproduces across Chrome versions

We tested with both Chrome 145 and a standalone Chromium 144 build — same behavior on both. This is not a Chrome 145-specific regression. It appears to be a Shopify admin-side change interacting with how
Chrome (all versions) handles in-flight requests when an iframe is removed from the DOM. Safari presumably handles this differently, which is why it's unaffected.

Environment

• App: Next.js 14 (Pages Router), deployed on Vercel
• App Bridge: CDN version (cdn.shopify.com/shopifycloud/app-bridge.js)
• Auth: Token exchange flow with embedded_app_direct_api_access = true
• Chrome: 145.0.7632.160 (arm64) + Chromium 144
• Safari: Works correctly
• macOS: Sequoia

[serGlazkov]

same issue

[c-schober]

the same here

[noelgoodday]

same here.

We're not seeing the iframe that loads our app when navigating directly to a nested link.

[uurcank]

On dev forums it has been reported as fixed

https://community.shopify.dev/t/blank-page-when-refreshing-the-shopify-embedded-apps/31962

[noelgoodday]

Thanks, it's now working for us again.