[Feature] Update WA-SQLite (#290)

Author: stevensJourney

.changeset/nice-impalas-speak.md

@@ -0,0 +1,5 @@
+---
+'@powersync/web': minor
+---
+
+Updated WA-SQLite to `@journeyapps/wa-sqlite@1.0.0`. Note that WA-SQLite performed some changes to the virtual filesystem structure in this update. An automatic migration will be executed when upgrading, however no down-migration is available. Downgrading to `@journeyapps/wa-sqlite < 1.0.0` will require the IndexDB storage to be erased.

demos/angular-supabase-todolist/package.json

@@ -21,7 +21,7 @@
     "@angular/platform-browser-dynamic": "^18.1.1",
     "@angular/router": "^18.1.1",
     "@angular/service-worker": "^18.1.1",
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@powersync/web": "workspace:*",
     "@supabase/supabase-js": "^2.44.4",
     "rxjs": "~7.8.1",

demos/example-capacitor/package.json

@@ -23,7 +23,7 @@
     "@capacitor/core": "latest",
     "@capacitor/ios": "^6.0.0",
     "@capacitor/splash-screen": "latest",
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@powersync/react": "workspace:*",
     "@powersync/web": "workspace:*",
     "js-logger": "^1.6.1",

demos/example-electron/package.json

@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/react": "^11.13.0",
     "@emotion/styled": "^11.13.0",
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@mui/icons-material": "^5.15.16",
     "@mui/material": "^5.15.16",
     "@mui/x-data-grid": "^6.19.11",

demos/example-nextjs/package.json

@@ -14,7 +14,7 @@
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
     "@fontsource/roboto": "^5.0.13",
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@lexical/react": "^0.15.0",
     "@mui/icons-material": "^5.15.18",
     "@mui/material": "^5.15.18",

demos/react-multi-client/package.json

@@ -10,7 +10,7 @@
     "test:build": "pnpm build"
   },
   "dependencies": {
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@powersync/react": "workspace:*",
     "@powersync/web": "workspace:*",
     "@supabase/supabase-js": "^2.43.1",

demos/react-supabase-todolist/package.json

@@ -13,7 +13,7 @@
     "@powersync/web": "workspace:*",
     "@emotion/react": "11.11.4",
     "@emotion/styled": "11.11.5",
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@mui/icons-material": "^5.15.12",
     "@mui/material": "^5.15.12",
     "@mui/x-data-grid": "^6.19.6",

demos/yjs-react-supabase-text-collab/package.json

@@ -14,7 +14,7 @@
     "@fontsource/roboto": "^5.0.12",
     "@powersync/react": "workspace:*",
     "@powersync/web": "workspace:*",
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@lexical/react": "^0.11.3",
     "@mui/icons-material": "^5.15.12",
     "@mui/material": "^5.15.12",

packages/kysely-driver/package.json

@@ -33,7 +33,7 @@
   },
   "devDependencies": {
     "@powersync/web": "workspace:*",
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@types/node": "^20.17.6",
     "@vitest/browser": "^2.1.4",
     "ts-loader": "^9.5.1",

packages/web/package.json

@@ -56,7 +56,7 @@
   "author": "JOURNEYAPPS",
   "license": "Apache-2.0",
   "peerDependencies": {
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@powersync/common": "workspace:^1.21.0"
   },
   "dependencies": {
@@ -67,7 +67,7 @@
     "js-logger": "^1.6.1"
   },
   "devDependencies": {
-    "@journeyapps/wa-sqlite": "^0.4.2",
+    "@journeyapps/wa-sqlite": "^1.0.0",
     "@types/uuid": "^9.0.6",
     "@vitest/browser": "^2.1.4",
     "crypto-browserify": "^3.12.0",

packages/web/src/shared/open-db.ts

@@ -1,9 +1,9 @@
-import * as SQLite from '@journeyapps/wa-sqlite';
 import '@journeyapps/wa-sqlite';
+import * as SQLite from '@journeyapps/wa-sqlite';
+import { BatchedUpdateNotification } from '@powersync/common';
+import { Mutex } from 'async-mutex';
 import * as Comlink from 'comlink';
 import type { DBFunctionsInterface, OnTableChangeCallback, WASQLExecuteResult } from './types';
-import { Mutex } from 'async-mutex';
-import { BatchedUpdateNotification } from '@powersync/common';
 
 let nextId = 1;
 
@@ -15,8 +15,14 @@ export async function _openDB(
   const module = await moduleFactory();
   const sqlite3 = SQLite.Factory(module);
 
+  /**
+   * Register the PowerSync core SQLite extension
+   */
+  module.ccall('powersync_init_static', 'int', []);
+
   const { IDBBatchAtomicVFS } = await import('@journeyapps/wa-sqlite/src/examples/IDBBatchAtomicVFS.js');
-  const vfs = new IDBBatchAtomicVFS(dbFileName);
+  // @ts-expect-error The types for this static method are missing upstream
+  const vfs = await IDBBatchAtomicVFS.create(dbFileName, module, { lockPolicy: 'exclusive' });
   sqlite3.vfs_register(vfs, true);
 
   const db = await sqlite3.open_v2(dbFileName);
@@ -37,7 +43,10 @@ export async function _openDB(
     Array.from(listeners.values()).forEach((l) => l(event));
   }
 
-  sqlite3.register_table_onchange_hook(db, (opType: number, tableName: string, rowId: number) => {
+  sqlite3.update_hook(db, (updateType: number, dbName: string | null, tableName: string | null) => {
+    if (!tableName) {
+      return;
+    }
     updatedTables.add(tableName);
     if (updateTimer == null) {
       updateTimer = setTimeout(fireUpdates, 0);
@@ -134,52 +143,48 @@ export async function _openDB(
     return _acquireExecuteLock(async (): Promise<WASQLExecuteResult> => {
       let affectedRows = 0;
 
-      const str = sqlite3.str_new(db, sql);
-      const query = sqlite3.str_value(str);
       try {
         await executeSingleStatement('BEGIN TRANSACTION');
 
-        //Prepare statement once
-        const prepared = await sqlite3.prepare_v2(db, query);
-        if (prepared === null) {
-          return {
-            rowsAffected: 0,
-            rows: { _array: [], length: 0 }
-          };
-        }
         const wrappedBindings = bindings ? bindings : [];
-        for (const binding of wrappedBindings) {
-          // TODO not sure why this is needed currently, but booleans break
-          for (let i = 0; i < binding.length; i++) {
-            const b = binding[i];
-            if (typeof b == 'boolean') {
-              binding[i] = b ? 1 : 0;
-            }
+        for await (const stmt of sqlite3.statements(db, sql)) {
+          if (stmt === null) {
+            return {
+              rowsAffected: 0,
+              rows: { _array: [], length: 0 }
+            };
           }
 
-          //Reset bindings
-          sqlite3.reset(prepared.stmt);
-          if (bindings) {
-            sqlite3.bind_collection(prepared.stmt, binding);
-          }
+          //Prepare statement once
+          for (const binding of wrappedBindings) {
+            // TODO not sure why this is needed currently, but booleans break
+            for (let i = 0; i < binding.length; i++) {
+              const b = binding[i];
+              if (typeof b == 'boolean') {
+                binding[i] = b ? 1 : 0;
+              }
+            }
 
-          const result = await sqlite3.step(prepared.stmt);
-          if (result === SQLite.SQLITE_DONE) {
-            //The value returned by sqlite3_changes() immediately after an INSERT, UPDATE or DELETE statement run on a view is always zero.
-            affectedRows += sqlite3.changes(db);
+            if (bindings) {
+              sqlite3.bind_collection(stmt, binding);
+            }
+            const result = await sqlite3.step(stmt);
+            if (result === SQLite.SQLITE_DONE) {
+              //The value returned by sqlite3_changes() immediately after an INSERT, UPDATE or DELETE statement run on a view is always zero.
+              affectedRows += sqlite3.changes(db);
+            }
+
+            sqlite3.reset(stmt);
           }
         }
-        //Finalize prepared statement
-        await sqlite3.finalize(prepared.stmt);
+
         await executeSingleStatement('COMMIT');
       } catch (err) {
         await executeSingleStatement('ROLLBACK');
         return {
           rowsAffected: 0,
           rows: { _array: [], length: 0 }
         };
-      } finally {
-        sqlite3.str_finish(str);
       }
       const result = {
         rowsAffected: affectedRows,