0

Updating an item logs correct, but old value persist

I'm trying to update the value of my Dexie Db however the old value persist.

This is from the parent component.

  async onEdited(tagItem: TagItem) {
    console.log("Id: " + tagItem.selection); // logs new value
    this.updateItem(tagItem);
  }

  async updateItem(tagItem: TagItem) {
    console.log("Id: " + tagItem.id); // logs correctly
    console.log("Id: " + tagItem.selection); // logs new value
    await db.TagItem.update(tagItem.id, {
      tags: tagItem.tags,
      Selection: tagItem.selection,
      isFlipped: tagItem.isFlipped,
    });
    // Get the updated item from the database
    const updatedItem = await db.TagItem.get(tagItem.id);
    console.log("Updated item: " + updatedItem?.selection); // logs old value
  }

I'm using the updateItem method in other functions as well, for updating other properties and then they update. But not in this function and I do not know why.

Let me know if I should post the templateUrl or other information. But since it logs correctly in the onEdited function, I really have no idea why this does not work.

I have tried skipping the async and await. Also tried with

setTimeout(() => {
      this.updateItem(TagItem);
    }, 500);

1 Answer 1

0

This seems very strange and I could not understand why you see this behavior. I don't know exactly what types selection, tags and isFlipped are but I assume tags is string[] and isFlipped is boolean.

One theoretical reason for the issue would be in case selection would be a reference type such as an object or array and the value changes by some other code directly after having called updateItem(). To make sure this isnt' the issue, try if you get another result if you deep-clone tagItem in onEdited() before logging its value.

async onEdited(tagItem: TagItem) {
    tagItem = JSON.parse(JSON.stringify(tagItem)); // (to surround the issue - don't keep this line) Just making sure we'll be working with an unchanged value
    console.log("Id: " + tagItem.selection); // logs new value
    this.updateItem(tagItem);
  }

...

Other options to nail down the issue:

  1. Try using various versions of Dexie, such as 1.5.1, 2.0.5, 3.2.3 and 4.0.1-alpha.8. Are you seeing the same behavior on all versions?

  2. Are you seeing the same behavior on all browsers?

  3. Call db.TagItem.update() in a transaction and catch the result of the transaction - does the transaction commit or is any error being caught? You shouldn't need to do this - it's just me brainstorming ways to surround the issue.

2
  • Thanks for a great product, I starred it on Github the day before yesterday. You helped me solve this with "One theoretical reason for the issue would be in case selection ". Made me realize it was all a typo, using uppercase Selection. / Skellefteå
    – Persson_F
    Feb 20 at 8:10
  • I'm glad it wasn't a bug and that you found the typo! Tack för star och lycka till! Feb 21 at 9:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.