Skip to content

feat(examples): add cross-origin host toggle to iframe-test page#136

Open
Shridhad wants to merge 1 commit into
mainfrom
feat/iframe-test-cross-origin-host
Open

feat(examples): add cross-origin host toggle to iframe-test page#136
Shridhad wants to merge 1 commit into
mainfrom
feat/iframe-test-cross-origin-host

Conversation

@Shridhad
Copy link
Copy Markdown
Collaborator

Summary

Follow-up to #135. Adds a Host selector to /iframe-test so the embedded src can switch between:

  • Local (same-origin) — embeds localhost:3000, the same app rendering the page (covers same-origin embedding)
  • Deployed (cross-origin) — embeds https://neon-auth-nextjs-demo.vercel.app, so the parent page and the embedded auth app live on different domains

The cross-origin case is the more realistic embedded scenario — widgets, multi-tenant platforms, partner integrations, customer-facing dashboards, etc. — where most "auth in iframe" things break in subtle ways. This lets the example exercise both code paths from a single dev server.

The deployed app at neon-auth-nextjs-demo.vercel.app does not set X-Frame-Options or a frame-ancestors CSP (verified via curl -I), so it embeds cleanly. @neondatabase/auth already sets SameSite=None; Secure; Partitioned proxy cookies (#132), which is what's needed for the iframe's session cookies to survive the third-party context.

The "What to test" notes are expanded to call out the third-party cookie behaviour explicitly so adopters know what browser policies are at play.

Test plan

  • cd examples/nextjs-neon-auth && pnpm dev
  • Visit http://localhost:3000/iframe-test
  • Local host: Sign in with email/password and with Google SSO; confirm the iframe ends up signed-in and no popup is left dangling
  • Deployed host: switch to "Deployed (cross-origin)"; the iframe should render the deployed sign-in form
  • Sign in with email/password against the deployed app inside the iframe; cookies should be set on vercel.app (Application → Cookies in DevTools)
  • Sign in with Google SSO against the deployed app inside the iframe; the popup opens on vercel.app, completes, closes, and the iframe shows the signed-in state
  • Browser console shows no X-Frame-Options / CSP errors for either host

Adds a Host selector to /iframe-test so the embedded src can switch
between the local app (same-origin, localhost:3000) and the deployed
demo (cross-origin, https://neon-auth-nextjs-demo.vercel.app). This
exercises the more realistic embedded scenario where the parent page
and the embedded auth app are on different domains — widgets,
multi-tenant platforms, and partner integrations.

Also expands the "What to test" notes to cover the third-party cookie
considerations (SameSite=None; Secure; Partitioned) that apply to
cross-origin iframes.
@vercel
Copy link
Copy Markdown

vercel Bot commented May 10, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
neon-auth-nextjs Error Error May 10, 2026 3:43pm

Request Review

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants