[Fix] React Native Polyfill Load Race #199
Merged
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.
Overview
The web socket release moved much of the shared sync stream
fetch
implementation to the common package. This usedcross-fetch
to provide afetch
implementation across the different SDKs. The release also made it possible to provide afetchImplementation
forAbstractRemote
to use.An issue could occur due to the nature of the
DEFAULT_REMOTE_OPTIONS.fetchImplementation
obtaining a reference tofetch
in the global scope: i.e once the file has been loaded or imported. This can cause race conditions between applyingfetch
polyfills and obtaining the reference tofetch
.In the case of React Native this causes the timing of calling
import 'react-native-polyfills-globals/auto'
to be critical. It must be called before importing the PowerSync SDK.This PR moves away from obtaining a reference to the default
fetch
implementation and introduces aFetchImplementationProvider
lazy loader which will get the implementation when it is used. This should help in the case where polyfills are applied.The concept of custom fetch implementations is then taken one step further in the React Native SDK by using the
fetch
implementation directly fromreact-native-fetch-api
. Polyfills are still needed forReadableStream
,TextEncoder
etc, but this ensures afetch
implementation which supports streaming will always be used in the React Native SDK.Testing
This was tested in the React Native Supabase Todolist app on iOS with the HTTP streaming connection mode enabled.
Note: the Android version of the app is currently completely broken. Attempting to

pnpm android
results inThis issue seems to be common, but none of those suggestions fixes it. This PR includes updates for
expo install --fix
which also does not fix Android.Testing Update:
It seems like the React Native Supabase todolist Expo 51 configuration broke sometime after it was introduced here #167.
The error above seems to be due to the native android project using the wrong version of
expo-camera
from the monorepo. Copying the demo to a standalone folder fixed the compilation issue.The React native demos are now all updated to Expo 51 to ensure there are no package mismatches in the monorepo.
The fetch implementation changes were tested below.
Supabase Todolist app:
fetch_method_test.mov
Group chat app:
group_chat.mov
The Django app was also updated and verified that the app compiled and ran on both Android and iOS. This app was not end-to-end tested due to it's complex setup instructions.