Skip to content

fix(register): allow all WebView frame schemes so the Turnstile challenge completes on iOS#3287

Merged
feruzm merged 2 commits into
developmentfrom
fix/turnstile-webview-ios-frame-decision
Jun 23, 2026
Merged

fix(register): allow all WebView frame schemes so the Turnstile challenge completes on iOS#3287
feruzm merged 2 commits into
developmentfrom
fix/turnstile-webview-ios-frame-decision

Conversation

@feruzm

@feruzm feruzm commented Jun 23, 2026

Copy link
Copy Markdown
Member

Problem

On iOS the free-signup Turnstile widget renders blank and "Register Free" stays disabled (the challenge never issues a token). Reproduced on the latest TestFlight build from development, which already includes #3284.

Root cause

react-native-webview gates every frame navigation against originWhitelist (WebViewShared.jscompileWhitelist/passesWhitelist). #3284 set the list to ['https://*', 'about:'] and added an onShouldStartLoadWithRequest that returned true only for https/about.

Cloudflare's Managed challenge renders in a challenges.cloudflare.com iframe and runs its verification compute in nested sub-frames across several schemes — about:srcdoc / about:blank and, on iOS, often blob: / data:. The narrow whitelist plus the restrictive handler cancelled the blob:/data: compute frames, so the challenge could never complete. #3284 unblocked about: (which is why the symptom moved from "spins on Verifying…" to fully blank) but that alone was not sufficient.

The embed page itself is healthy on prod (returns the correct widget HTML, the enforced CSP permits the CF script, and Cloudflare is not challenging it) — the failure is entirely in the iOS WebView's per-scheme frame gating.

Fix

This WebView only ever loads our own first-party /embed/turnstile page plus the Cloudflare challenge it pulls in, so there is no value in enumerating which schemes Cloudflare uses:

  • originWhitelist={['*']} so no scheme the challenge needs (about:, blob:, data:) is dropped. This is a superset of the previous list — about: is still allowed.
  • Remove the custom onShouldStartLoadWithRequest (with ['*'] a handler could only re-add the same restriction).
  • webviewDebuggingEnabled={__DEV__} so any remaining issue can be inspected on-device via Safari Web Inspector on a dev build, without shipping an inspectable WebView to release/TestFlight.

Testing

  • prettier 2.8.8 + eslint clean.
  • Needs on-device iOS verification: run a dev build (yarn ios) on a real device, open free signup, and confirm the Turnstile widget renders and "Register Free" enables after the check. If anything is still off, attach Safari Web Inspector (now enabled in dev) and capture the failing frame/console.

…enge completes on iOS

#3284 widened the Turnstile WebView's originWhitelist to ['https://*', 'about:'] and added
an onShouldStartLoadWithRequest that returned true only for https/about. But react-native-
webview gates every frame against originWhitelist, and Cloudflare's Managed challenge also
spins up blob:/data: compute sub-frames. Those were cancelled, so the challenge never issued
a token and the widget stayed blank with a dead "Register Free". about: was necessary but not
sufficient on its own.

This WebView only ever loads our own embed page plus the CF challenge it pulls in, so allow
all schemes (originWhitelist ['*']) and drop the custom handler instead of enumerating the
schemes Cloudflare uses. Add dev-only webviewDebuggingEnabled for on-device Safari Web
Inspector diagnosis.
@coderabbitai

coderabbitai Bot commented Jun 23, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@feruzm, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 16 minutes and 11 seconds. Learn how PR review limits work.

Your organization has used up its prepaid credits, and credit purchases are no longer available. Enable the review add-on in the billing tab to keep reviews running — you're only billed for reviews past your plan's rate limits ($0.25/file).

⌛ How to resolve this issue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based credits.

🚦 How do rate limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan refill rate.

For paid Pro and Pro+ PR reviews, CodeRabbit uses rolling per-developer review limits. Reviews become available again as older review attempts age out of the rolling limit window.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 6464035b-1201-4a02-85bb-1b08f8e2bd98

📥 Commits

Reviewing files that changed from the base of the PR and between 3dd1289 and 988bc61.

📒 Files selected for processing (1)
  • src/screens/register/children/turnstileWebView.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/turnstile-webview-ios-frame-decision

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@greptile-apps

greptile-apps Bot commented Jun 23, 2026

Copy link
Copy Markdown

Greptile Summary

This PR fixes the Cloudflare Turnstile widget rendering blank on iOS by widening the WebView frame policy so blob: and data: sub-frames used by the challenge compute are no longer silently dropped.

  • Replaces the narrow originWhitelist (['https://*', 'about:']) with ['*'], ensuring react-native-webview passes every frame navigation to the handler rather than dropping unrecognised schemes before the handler is called.
  • Restores security for the top-level document via an isTopFrame-aware onShouldStartLoadWithRequest handler that allows all sub-frames unconditionally while constraining top-frame navigations to https://ecency.com/ — addressing the concern raised in the prior review thread.
  • Adds webviewDebuggingEnabled={__DEV__} to enable Safari Web Inspector on dev builds without exposing an inspectable WebView in release/TestFlight.

Confidence Score: 5/5

Safe to merge — the change is narrow and well-scoped to a single WebView used only for the Turnstile challenge, and the top-level navigation guard is correctly restored.

The concern from the prior review (top-frame unguarded) has been properly addressed: the new _shouldStartLoad handler uses isTopFrame to allow sub-frames unconditionally while restricting top-level navigation to https://ecency.com/. The startsWith check (with trailing slash) correctly prevents origin-confusion attacks. The webviewDebuggingEnabled flag is gated on DEV so it does not reach production builds.

No files require special attention.

Important Files Changed

Filename Overview
src/screens/register/children/turnstileWebView.tsx Widens WebView frame policy to allow all sub-frame schemes while keeping top-level navigation constrained to ecency.com; adds dev-only WebView debugging. Logic is correct and well-commented.

Sequence Diagram

%%{init: {'theme': 'neutral'}}%%
sequenceDiagram
    participant App as React Native App
    participant WV as WebView (iOS WKWebView)
    participant Ecency as ecency.com/embed/turnstile
    participant CF as challenges.cloudflare.com (iframe)
    participant Blob as blob:/data: sub-frames

    App->>WV: "source={{ uri: TURNSTILE_EMBED_URL }}"
    WV->>WV: "onShouldStartLoadWithRequest<br/>(isTopFrame=true, url=https://ecency.com/…)<br/>→ allow (startsWith origin)"
    WV->>Ecency: load top frame
    Ecency->>WV: injects Cloudflare Turnstile script
    WV->>WV: "onShouldStartLoadWithRequest<br/>(isTopFrame=false, url=https://challenges.cloudflare.com/…)<br/>→ allow (isTopFrame===false)"
    WV->>CF: load Turnstile iframe
    CF->>WV: spawns blob:/data: compute sub-frames
    WV->>WV: "onShouldStartLoadWithRequest<br/>(isTopFrame=false, url=blob:…)<br/>→ allow (isTopFrame===false)"
    WV->>Blob: run compute frames
    Blob-->>CF: challenge verified
    CF-->>Ecency: token issued
    Ecency-->>WV: "postMessage({ type: 'verify', token })"
    WV-->>App: onVerify(token)
Loading
%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
sequenceDiagram
    participant App as React Native App
    participant WV as WebView (iOS WKWebView)
    participant Ecency as ecency.com/embed/turnstile
    participant CF as challenges.cloudflare.com (iframe)
    participant Blob as blob:/data: sub-frames

    App->>WV: "source={{ uri: TURNSTILE_EMBED_URL }}"
    WV->>WV: "onShouldStartLoadWithRequest<br/>(isTopFrame=true, url=https://ecency.com/…)<br/>→ allow (startsWith origin)"
    WV->>Ecency: load top frame
    Ecency->>WV: injects Cloudflare Turnstile script
    WV->>WV: "onShouldStartLoadWithRequest<br/>(isTopFrame=false, url=https://challenges.cloudflare.com/…)<br/>→ allow (isTopFrame===false)"
    WV->>CF: load Turnstile iframe
    CF->>WV: spawns blob:/data: compute sub-frames
    WV->>WV: "onShouldStartLoadWithRequest<br/>(isTopFrame=false, url=blob:…)<br/>→ allow (isTopFrame===false)"
    WV->>Blob: run compute frames
    Blob-->>CF: challenge verified
    CF-->>Ecency: token issued
    Ecency-->>WV: "postMessage({ type: 'verify', token })"
    WV-->>App: onVerify(token)
Loading

Reviews (2): Last reviewed commit: "fix(register): guard only the top frame,..." | Re-trigger Greptile

Comment thread src/screens/register/children/turnstileWebView.tsx
Address Greptile review: originWhitelist ['*'] with no handler left top-level
navigation unguarded, so a compromised embed page or open redirect could steer the
WebView to file:/javascript:/another origin. Restore onShouldStartLoadWithRequest but
gate ONLY the top-level document to our own origin; every sub-frame is still allowed,
so Cloudflare's about:/blob:/data: compute frames are never re-blocked (a sub-frame is
never the top frame).
@feruzm feruzm merged commit ac43361 into development Jun 23, 2026
10 of 12 checks passed
@feruzm feruzm deleted the fix/turnstile-webview-ios-frame-decision branch June 23, 2026 06:00
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.

1 participant