I would like to store some settings for sites individually and my idea was to store a map with the domain names as keys and the settings as value using storage.sync from the Chrome API.

When I try to access a map I just retrieved using storage.sync.get I get the error:

Error handling response: TypeError: result.sites.get is not a function

In the documentation(link to highlight) it is mentioned that data can be stored as objects. I'm not sure what the problem is since maps are objects:

var map = new Map([[1,2],[3,4]]);
console.log(map instanceof Object); //true

Here I read that serialization is a problem when you try to store objects using storage.local. I don't know if this should be a problem with storage.sync though.

Here's the code I'm trying to run:

var siteList = new Map();

siteList.set('site1', {settings: "foo"});
siteList.set('site2', {settings: "bar"});

chrome.storage.sync.set({sites: siteList}, function() {
    console.log("Map set");
});
        
chrome.storage.sync.get(['sites'], function(result) {
    console.log(result.sites);
    console.log(result.sites.get('site1')); // This yields the error
});

As you can see I also console.log result.sites, this resulted in a [[Prototype]]: Object that looks like this:

constructor: ƒ Object()
hasOwnProperty: ƒ hasOwnProperty()
isPrototypeOf: ƒ isPrototypeOf()
propertyIsEnumerable: ƒ propertyIsEnumerable()
toLocaleString: ƒ toLocaleString()
toString: ƒ toString()
valueOf: ƒ valueOf()
__defineGetter__: ƒ __defineGetter__()
__defineSetter__: ƒ __defineSetter__()
__lookupGetter__: ƒ __lookupGetter__()
__lookupSetter__: ƒ __lookupSetter__()
__proto__: (...)
get __proto__: ƒ __proto__()
set __proto__: ƒ __proto__()

If someone knows if it is possible at all to store maps using storage.sync and if so, how to do it, I'd be glad to hear it!

~Naitzirch