claude-code - 💡(How to fix) Fix Preview blocks cross-origin redirects (Stripe Checkout, OAuth, etc.) — silent failure with no fallback

Problem

The in-IDE preview window (Claude Code preview / Claude in Chrome MCP) silently blocks:

• window.location.href = 'https://external-domain.com/...' (top-level cross-origin navigation)
• window.open(url, '_blank') (popup)
• target="_blank" link clicks

This makes any flow that needs to leave the local dev origin impossible to test inside Claude Code:

• Stripe Checkout — window.location.href = checkoutSessionUrl does nothing in preview
• Stripe Customer Portal — same problem
• OAuth redirects (Google, GitHub, LINE, Figma, Slack, etc.) — window.location.href = authUrl blocked
• External "Open docs" / "View on Stripe Dashboard" links in admin tooling
• Auth0 / Clerk / Supabase Auth hosted flows that redirect out then back
• Public preview links for the app under development (Open in new tab)

The clicked button just does nothing, with no UI indication that the navigation was blocked. There's no console error, no toast, no fallback.

Current workaround (painful)

We end up:

1. Console-logging the target URL
2. Copying it manually
3. Pasting into a real Chrome window outside the IDE
4. Doing the whole flow there
5. Coming back to the IDE

For a payment flow we tested 30+ times this round, this added ~15 minutes per iteration.

Desired behavior

Any of these would be a huge improvement, in rough order of niceness:

1. Allow the navigation, with a confirmation banner. Show "→ Navigating to checkout.stripe.com — confirm / cancel" at the top of the preview. User confirms → preview navigates. Return URL re-mounts the dev server preview.
2. Auto-open in a side-by-side panel. Detect blocked navigation, open the URL in a panel next to the preview. Postmessage between dev preview and the panel for return URLs.
3. Show clear "popup blocked" indication. A subtle banner "🔒 navigation to checkout.stripe.com blocked — open in browser" with a one-click button that copies the URL or opens it externally.
4. Honor target="_blank" literally — open in a real new browser tab (outside the preview iframe).

Any of (1)–(4) lets developers test full payment / OAuth flows without leaving Claude Code.

Reproduction

1. Create a Vite/React app in Claude Code
2. Add a button that runs window.location.href = 'https://checkout.stripe.com/test/cs_test_xxx'
3. Open preview
4. Click the button
5. Nothing happens. No error. No indication. No fallback.

Why this matters

Modern web apps redirect-then-return for: payments, OAuth, file uploads to cloud, sharing, embeds, customer portals. The preview being unable to follow even ONE redirect means a meaningful chunk of real-world apps can't be tested in-IDE.

Today I'm shipping a Stripe payments feature; tomorrow it's OAuth login or "Manage subscription" — same problem each time. Claude Code is great at writing the code; the gap is testing it without browser-switching.

Suggested priority

This is the single biggest blocker I've hit in real-world feature dev with Claude Code over the past two months. Would happily upvote / sponsor / bug-bash a fix.

Thanks for the work on Claude Code 🙏 — it's been transformational. This one preview limitation is the main friction left.