IndexedDB premium storage does not allow storing array properties

[leandrogehlen]

Using getRxStorageIndexedDB when the schema has array properties on insert/update a document the error bellow is raised:

indexeddb-storage-instance.js:1 Uncaught (in promise) DOMException: Failed to execute 'put' on 'IDBObjectStore': [object Array] could not be cloned. at l.bulkWrite (webpack-internal:///./node_modules/rxdb-premium/dist/es/plugins/storage-indexeddb/indexeddb-storage-instance.js:19:1349) at async RxCollectionBase.bulkInsert (webpack-internal:///./node_modules/rxdb/dist/es/rx-collection.js:180:19) at async RxCollectionBase.insert (webpack-internal:///./node_modules/rxdb/dist/es/rx-collection.js:145:23) at async onSaveClick (webpack-internal:///./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/PageForm.vue?vue&type=script&setup=true&lang=ts:46:11)

Using getRxStorageDexie() works fine

Example repo:
https://github.com/leandrogehlen/ionic-vue-rxdb/tree/storage-indexeddb

[pubkey]

Related: localForage/localForage#610

You can only store plain JSON data in RxDB. RxDB does not json-parse because the performance would decrease.
I will add a dev-mode check to give a better error message.

[leandrogehlen]

I don't understand
The the object bellow is not considered a plain object?:

database.collections.contacts.insert({
  id:  'abacdef'
  name: 'Leandro',
  emails: [
    '[email protected]'
  ]
})

Following the reference Plain Objects the object above is a plain object.

[pubkey]

Can you make a PR with a test case?

[leandrogehlen]

I found this test in the RxDB repository, and I believe that this test is not being executed using IndexedDB storage.

[pubkey]

[leandrogehlen]

I found the problem.
I was using ref that makes a proxy object.
To solve it is necessary use toRaw before store the object in rxdb

[lavaxun]

Hi @pubkey.
Thought it might be easier to just report the issue in here than creating a new ticket.

The structuredClone in the latest release ("rxdb": "15.0.0-beta.33") seems not working for React Native.
I've added a console.log to the dev-mode plugin and it shows the following error message.

currently we're using a quick workaround in the codebase. however this does not seem ideal. Hope to have a proper fix from the plugin itself.

if (process.env.NODE_ENV !== 'production') {
  if (!global.structuredClone) {
    global.structuredClone = function structuredClone(objectToClone: any) {
      const stringified = JSON.stringify(objectToClone);
      const parsed = JSON.parse(stringified);
      return parsed;
    };
  }
}

Further read:

• structuredClone support in RN/hermes : Support for structuredClone facebook/hermes#684

[pubkey]

@lavaxun Thank you for reporting. I am working on a fix: #5321

[lavaxun]

@lavaxun Thank you for reporting. I am working on a fix: #5321

thank you!