0

I have been trying to get my first chrome app to utilize chrome storage, but the code never gets parsed until after code execution. I have written a small example of what I mean below.

There is a for loop that executes 3 times. I call chrome.storage.sync.set each time, however the code never enters the body of the function and I receive no error. This is also the same for the chrome.storage.sync.get call, the debugger never enters the body of the function.

After the loop has been executed 3 times, and exits the loop, the next line jumps back to the chrome.storage.sync lines. I've placed a console.log each time to display which statement is being executed.

Below is the sample code along with the console output. I would like to find out why I cannot add to chrome storage at the correct time.

Note that I do have storage permissions enabled in my manifest.json

Code:

//function to test storage
function testStorage() {
    for (var i = 0; i < 3; i++) {
        console.log(i + '/' + 2);
        chrome.storage.sync.set({'key':'value'}, function() {
            debugger;
            console.log('set: ' + i);
        });
        chrome.storage.sync.get('key',function(result){
            console.log(i + ' : ' + result.key);
        });
    }

    console.log('loop complete');
}

Output:

0/2
1/2
2/2
loop complete
set: 3
3 : value
set: 3
3 : value
set: 3
3 : value
Citanaf
  • 445
  • 2
  • 7
  • 22
  • Chrome extensions API is asynchronous which should be used in an entirely different fashion. The simplest solution is to load [WebExtension polyfill](https://github.com/mozilla/webextension-polyfill) and use async/await syntax. – wOxxOm Apr 11 '19 at 19:29
  • Yes, this is an issue with the asynchronous process inside a for loop. Thank you for pointing me in the correct direction. I have marked your comment as the answer. – Citanaf Apr 11 '19 at 19:36

0 Answers0