{{ message }}
Repository navigation
fix(connect): stop components hanging on double quotes in init params - #2758
Merged
Merged
Conversation
react-native-webview's injectedJavaScriptObject embeds the JSON in a JS template literal (iOS; Android from 13.13.1), so a double quote, backslash, newline, or backtick in any init param stops the Connect page from starting: the component never leaves its loader and never calls onLoadError. A double-quoted family name in appearance.variables.fontFamily is enough. Also pass the init params as an injectedJavaScriptBeforeContentLoaded script, replacing the empty placeholder. It defines window.ReactNativeWebView.injectedObjectJson() read-only, with the JSON in a string literal, so react-native-webview's definition can't replace it. Keep injectedJavaScriptObject: on Android, react-native-webview 13.6.0-13.13.0 serves it from a Java method that page scripts can't override and that never had this bug.
…cript The escaping only mattered for pre-ES2019 engines, which the SDK's minimum iOS and Android WebView versions don't include. Also document why the init params are stringified twice. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Committed-By-Agent: claude
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Committed-By-Agent: claude
guido-stripe
force-pushed
the
fix/connect-injected-object-escaping
branch
from
October 21, 2026 08:32
a7a1bbc to
f90a600
Compare
Contributor
asendra-stripe
approved these changes
Oct 21, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes Connect embedded components loading forever, without calling
onLoadError, when an init param (appearance,locale,fonts, or a component prop) contains a double quote, backslash, or backtick. An ordinary CSS font stack is enough to trigger it, e.g.fontFamily: '"Courier New", Courier, monospace'.EmbeddedComponentnow also passes the init params ininjectedJavaScriptBeforeContentLoaded. That script defineswindow.ReactNativeWebView.injectedObjectJson()as a read-only property that returns the JSON from a JS string literal, so react-native-webview's own definition can't replace it.injectedJavaScriptObjectis still passed, because react-native-webview 13.6.0–13.13.0 on Android servesinjectedObjectJson()from a Java method instead.This is based on #2680 by @BhodiSea, who found the root cause, wrote the fix and tests, and filed #2681. Their commit is kept as is, with their authorship. On top of it, this PR rebases onto master, drops the U+2028/U+2029 escaping (only needed for pre-ES2019 engines, which the SDK doesn't support), documents the double
JSON.stringify, and moves the changelog entry to Unreleased.Closes #2681
Motivation
react-native-webview embeds the
injectedJavaScriptObjectJSON in a JS template literal. It does this on iOS, and on Android from 13.13.1. The template literal turns\"into"and\\into\, so the Connect page's startupJSON.parsethrows and the page never reports load success or failure. Upstream: react-native-webview/react-native-webview#3957 (iOS) and react-native-webview/react-native-webview#3942 (Android). Their fixes (react-native-webview/react-native-webview#3958 and react-native-webview/react-native-webview#3929) are still open. Since ourreact-native-webviewpeer dependency is*, an upstream fix would only reach apps that upgrade.Testing
Manual:
example-stripe-connect, Retro preset withfontFamily: '"Courier New", Courier, monospace', Account onboarding → Show Onboarding.Automated:
injectedObjectScript.test.tsruns the script in a Nodevmcontext. It checks that quoted, backslash, newline, backtick,${…}, U+2028/U+2029 and non-ASCII values round-trip exactly, and that the value survives react-native-webview's iOS and Android definitions running before or after it.EmbeddedComponent.test.tsxchecks that the script carries the same init params asinjectedJavaScriptObject; both of its new tests fail on master.Documentation
Select one:
Added a CHANGELOG entry under Unreleased → Fixes.