[Feature] Set WebSocket as default (#256)

Co-authored-by: benitav <[email protected]>

.changeset/nine-bulldogs-burn.md

@@ -0,0 +1,6 @@
+---
+'@powersync/react-native': minor
+'@powersync/web': minor
+---
+
+Updated default streaming connection method to use WebSockets

demos/django-react-native-todolist/library/stores/system.ts

@@ -1,8 +1,8 @@
 import '@azure/core-asynciterator-polyfill';
+import { AbstractPowerSyncDatabase, PowerSyncDatabase } from '@powersync/react-native';
 import React from 'react';
-import { AbstractPowerSyncDatabase, PowerSyncDatabase, SyncStreamConnectionMethod } from '@powersync/react-native';
-import { AppSchema } from '../powersync/AppSchema';
 import { DjangoConnector } from '../django/DjangoConnector';
+import { AppSchema } from '../powersync/AppSchema';
 
 export class System {
   djangoConnector: DjangoConnector;
@@ -21,7 +21,7 @@ export class System {
 
   async init() {
     await this.powersync.init();
-    await this.powersync.connect(this.djangoConnector, { connectionMethod: SyncStreamConnectionMethod.WEB_SOCKET });
+    await this.powersync.connect(this.djangoConnector);
   }
 }
 

demos/react-native-supabase-todolist/library/powersync/system.ts

@@ -1,16 +1,16 @@
 import '@azure/core-asynciterator-polyfill';
 
+import { PowerSyncDatabase } from '@powersync/react-native';
 import React from 'react';
-import { PowerSyncDatabase, SyncStreamConnectionMethod } from '@powersync/react-native';
 import { SupabaseStorageAdapter } from '../storage/SupabaseStorageAdapter';
 
-import { AppSchema } from './AppSchema';
-import { SupabaseConnector } from '../supabase/SupabaseConnector';
-import { KVStorage } from '../storage/KVStorage';
-import { PhotoAttachmentQueue } from './PhotoAttachmentQueue';
 import { type AttachmentRecord } from '@powersync/attachments';
-import { AppConfig } from '../supabase/AppConfig';
 import Logger from 'js-logger';
+import { KVStorage } from '../storage/KVStorage';
+import { AppConfig } from '../supabase/AppConfig';
+import { SupabaseConnector } from '../supabase/SupabaseConnector';
+import { AppSchema } from './AppSchema';
+import { PhotoAttachmentQueue } from './PhotoAttachmentQueue';
 
 Logger.useDefaults();
 
@@ -51,7 +51,7 @@ export class System {
 
   async init() {
     await this.powersync.init();
-    await this.powersync.connect(this.supabaseConnector, { connectionMethod: SyncStreamConnectionMethod.WEB_SOCKET });
+    await this.powersync.connect(this.supabaseConnector);
 
     if (this.attachmentQueue) {
       await this.attachmentQueue.init();

demos/react-supabase-todolist/src/components/providers/SystemProvider.tsx

@@ -3,7 +3,7 @@ import { AppSchema } from '@/library/powersync/AppSchema';
 import { SupabaseConnector } from '@/library/powersync/SupabaseConnector';
 import { CircularProgress } from '@mui/material';
 import { PowerSyncContext } from '@powersync/react';
-import { PowerSyncDatabase, SyncStreamConnectionMethod } from '@powersync/web';
+import { PowerSyncDatabase } from '@powersync/web';
 import Logger from 'js-logger';
 import React, { Suspense } from 'react';
 import { NavigationPanelContextProvider } from '../navigation/NavigationPanelContext';
@@ -33,7 +33,7 @@ export const SystemProvider = ({ children }: { children: React.ReactNode }) => {
     const l = connector.registerListener({
       initialized: () => {},
       sessionStarted: () => {
-        powerSync.connect(connector, {connectionMethod: SyncStreamConnectionMethod.WEB_SOCKET});
+        powerSync.connect(connector);
       }
     });
 

packages/common/src/client/sync/stream/AbstractStreamingSyncImplementation.ts

@@ -111,7 +111,7 @@ export const DEFAULT_STREAMING_SYNC_OPTIONS = {
 };
 
 export const DEFAULT_STREAM_CONNECTION_OPTIONS: Required<PowerSyncConnectionOptions> = {
-  connectionMethod: SyncStreamConnectionMethod.HTTP,
+  connectionMethod: SyncStreamConnectionMethod.WEB_SOCKET,
   params: {}
 };
 

packages/react-native/README.md

@@ -6,7 +6,7 @@
 
 _[PowerSync](https://www.powersync.com) is a Postgres-SQLite sync layer, which helps developers to create local-first real-time reactive apps that work seamlessly both online and offline._
 
-This package (`packages/react-native`) is the PowerSync SDK for React Native clients. It is an extension of `packages/common`. It connects to a PowerSync instance via HTTP streams (enabled by default) or WebSockets.
+This package (`packages/react-native`) is the PowerSync SDK for React Native clients. It is an extension of `packages/common`.
 
 See a summary of features [here](https://docs.powersync.co/client-sdk-references/react-native-and-expo).
 

packages/web/tests/utils/MockStreamOpenFactory.ts

@@ -1,22 +1,22 @@
 import {
-  PowerSyncBackendConnector,
-  PowerSyncCredentials,
   AbstractPowerSyncDatabase,
   AbstractRemote,
-  RemoteConnector,
   AbstractStreamingSyncImplementation,
-  PowerSyncDatabaseOptions,
-  SyncStreamOptions,
+  BSONImplementation,
   DataStream,
+  PowerSyncBackendConnector,
+  PowerSyncCredentials,
+  PowerSyncDatabaseOptions,
+  RemoteConnector,
   StreamingSyncLine,
-  BSONImplementation
+  SyncStreamOptions
 } from '@powersync/common';
 import {
   PowerSyncDatabase,
-  WebPowerSyncDatabaseOptions,
-  WebStreamingSyncImplementation,
   WASQLitePowerSyncDatabaseOpenFactory,
-  WebPowerSyncOpenFactoryOptions
+  WebPowerSyncDatabaseOptions,
+  WebPowerSyncOpenFactoryOptions,
+  WebStreamingSyncImplementation
 } from '@powersync/web';
 
 export class TestConnector implements PowerSyncBackendConnector {
@@ -84,7 +84,8 @@ export class MockRemote extends AbstractRemote {
   }
 
   socketStream(options: SyncStreamOptions): Promise<DataStream<StreamingSyncLine>> {
-    throw new Error('Method not implemented.');
+    // For this test mock these are essentially the same
+    return this.postStream(options);
   }
 
   async postStream(options: SyncStreamOptions): Promise<DataStream<StreamingSyncLine>> {

tools/diagnostics-app/src/library/powersync/ConnectionManager.ts

@@ -2,7 +2,6 @@ import {
   BaseListener,
   BaseObserver,
   PowerSyncDatabase,
-  SyncStreamConnectionMethod,
   WebRemote,
   WebStreamingSyncImplementation,
   WebStreamingSyncImplementationOptions
@@ -75,7 +74,7 @@ if (connector.hasCredentials()) {
 }
 
 export async function connect() {
-  await sync.connect({ connectionMethod: SyncStreamConnectionMethod.WEB_SOCKET });
+  await sync.connect();
   if (!sync.syncStatus.connected) {
     // Disconnect but don't wait for it
     sync.disconnect();
@@ -91,7 +90,7 @@ export async function clearData() {
   await schemaManager.clear();
   await schemaManager.refreshSchema(db.database);
   if (connector.hasCredentials()) {
-    await sync.connect({ connectionMethod: SyncStreamConnectionMethod.WEB_SOCKET });
+    await sync.connect();
   }
 }