fix(web): multiple tabs not working (#184)

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

Author: DominicGBauer

.changeset/fair-dolphins-tie.md

@@ -0,0 +1,5 @@
+---
+'@powersync/web': patch
+---
+
+Created a fix to resolve the issue where watched queries would not update after syncing upstream changes

demos/example-capacitor/src/components/providers/SystemProvider.tsx

@@ -10,7 +10,7 @@ import { Capacitor } from '@capacitor/core';
 Logger.useDefaults();
 Logger.setLevel(Logger.DEBUG);
 
-const platform = Capacitor.getPlatform()
+const platform = Capacitor.getPlatform();
 const isIOs = platform === 'ios';
 // Web worker implementation does not work on iOS
 const useWebWorker = !isIOs;

packages/web/src/db/adapters/wa-sqlite/WASQLiteDBAdapter.ts

@@ -69,8 +69,7 @@ export class WASQLiteDBAdapter extends BaseObserver<DBAdapterListener> implement
         : getWorkerDatabaseOpener(this.options.dbFilename, enableMultiTabs);
 
       this.methods = await dbOpener(this.options.dbFilename);
-
-      this.methods!.registerOnTableChange(
+      this.methods.registerOnTableChange(
         Comlink.proxy((opType: number, tableName: string, rowId: number) => {
           this.iterateListeners((cb) => cb.tablesUpdated?.({ opType, table: tableName, rowId }));
         })
@@ -79,7 +78,6 @@ export class WASQLiteDBAdapter extends BaseObserver<DBAdapterListener> implement
       return;
     }
     this.methods = await _openDB(this.options.dbFilename, { useWebWorker: false });
-
     this.methods.registerOnTableChange((opType: number, tableName: string, rowId: number) => {
       this.iterateListeners((cb) => cb.tablesUpdated?.({ opType, table: tableName, rowId }));
     });

packages/web/src/worker/sync/SharedSyncImplementation.ts

@@ -132,7 +132,7 @@ export class SharedSyncImplementation
         new WASQLiteDBAdapter({
           dbFilename: params.dbName,
           workerPort: dbWorkerPort,
-          flags: { enableMultiTabs: true },
+          flags: { enableMultiTabs: true, useWebWorker: true },
           logger
         }),
         new Mutex(),