Felix Olszewski
Felix Olszewski

Reputation: 798

capacitor-sqlite on desktop web browser: TypeError: x is not a function upon database open

Minimum reproducible example:

https://github.com/folsze/capacitor-v6-sqlite-x-is-not-a-function

The minimal commit with the exact changes that led to the issue:

https://github.com/folsze/capacitor-v6-sqlite-x-is-not-a-function/commit/8beedb051dd5b3670548db975ff8b06a399aea58

capacitor community sqlite: TypeError: x is not a function upon startup, after upgrading to capacitor version 6

when I start my angular ionic capacitor community sqlite app, I get:

ERROR TypeError: x is not a function

in the browser console.

This all happens on the desktop-browser only 🖥️. On native ios/android (🍏/👾) it all works without problems. The browser uses sql-wasm.wasm afaik, so sql.js, an in-memory database, read more here:

https://github.com/capacitor-community/sqlite/blob/master/docs/Web-Usage.md

Steps to reproduce the behavior:

  1. clone this repo: https://github.com/folsze/capacitor-v6-sqlite-x-is-not-a-function
  2. start the app in the desktop browser with npm start
  3. check the console, you will see the error "TypeError: x is not a function"
  4. Expected behavior: No error

related github issue:

https://github.com/capacitor-community/sqlite/issues/574

EDIT: the error somehow also happened after downgrading to capv5 on my minimum reproducible example, but not in my main codebase capv5:

https://github.com/folsze/capacitor-v6-sqlite-x-is-not-a-function/commit/4201f5156bdf47f0d6744c9f7cd29fd7ccf41a1a

very strange.

Upvotes: 0

Views: 218

Answers (1)

Felix Olszewski
Felix Olszewski

Reputation: 798

Solved in this github issue:

https://github.com/capacitor-community/sqlite/issues/574#issuecomment-2269161964

Hello, I just found a way to run with Ionic v8. The problem (at least in my case) was the version of the sql.js. Use combatible version of sql.js (1.10.3) and copy the sql-wasm.wasm for the version 1.10.3 Here is the updated version of package.json

{
  "private": true,
  "version": "0.0.1",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc && vite build",
    "preview": "vite preview",
    "test:e2e": "cypress run",
    "test:unit": "vitest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@capacitor-community/sqlite": "^6.0.1",
    "@capacitor/android": "6.1.1",
    "@capacitor/app": "6.0.0",
   
    "@ionic/vue": "^8.0.0",
    "@ionic/vue-router": "^8.0.0",
    "@types/geojson": "^7946.0.14",
    "@types/leaflet": "^1.9.12",
    "ionicons": "^7.0.0",
    "jeep-sqlite": "^2.7.2",
    "sql.js": "1.10.3", // use specific version
  }
}

Upvotes: 0

Related Questions