Chrome extension storage remove not working

Question

I'm building a chrome extension and I'm having a problem with chrome.storage.sync.remove

Let's say this is the content from my chrome.storage :

And this contains the items I want to remove (removedItems[])

This is my code :

chrome.storage.sync.get(null, function(data) {
    coasterList = data;
    console.log('FFFFFFFF :',coasterList.data);
    chrome.storage.sync.remove(removedItems[0].CoasterName, function(data) {
      chrome.storage.sync.get(null, function(data) {
        var coasterListFINAL = data;
        console.log('FINAL LIST :',coasterListFINAL.data);
        //console.log(removedItems[0].CoasterName);
      });
    });
  });

Nothing is happening when I do :

chrome.storage.sync.remove(removedItems[0].CoasterName, function(data) {...}

What am I doing wrong ? (I have no errors but the key I want to remove, is still here)

Answer 1

YOUR CODE:

    chrome.storage.sync.set({'CoasterList':coasterListClean}, function() {
        console.log("SAVED");
    });

/*
if you try to retrieve the newly set storage var "CoasterList" right after setting it this way
you will probably get the old value 'cause you are reading something that is not changed yet
ALL CHROME.STORAGE APIS ARE ASYNCHRONOUS!!!
*/
    chrome.storage.sync.get(null, function(data) {
        console.log(data.coasterList);
    });

----------------------------------
/*
if you want to retrieve the new value of CoasterList you have
to get it inside the storage.sync.set callback function.
if you are under MV3 rules you can also use the "promise returned" syntax
THIS SHOUL WORK
*/
    chrome.storage.sync.set({'CoasterList':coasterListClean}, function() {
        console.log("SAVED");
        chrome.storage.sync.get(null, function(data) {
            console.log(data.coasterList);
        });
    });