chrome.storage between popup and browser action window

Question

I'm writing a chrome extension and I want to manage all of the data/variables with chrome storage. From what I understand, I should be able to use chrome.storage across my extension.

I want to set something in browser_action script and then access it in the window created by the background script. The HTML and JS files all have corresponding names.

This is what I have tried with no luck:

//manifest.json

{
  "manifest_version": 2,

  "name": "extension",
  "description": "my extension",
  "version": "0.1",

 "permissions": [
          "tabs",
          "storage"
        ],  

  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },  

  "browser_action": {
    "default_icon": {
      "38": "images/icon38.png"
    },  
    "default_popup": "settings.html"
  }

}

//background.js

chrome.windows.create({'url': chrome.extension.getURL("newPage.html"),'type': "detached_panel",'focused': true}, function(){
    //created newPage.html which has newPage.js
}); 

//setting.js

document.addEventListener('DOMContentLoaded', function(){
  chrome.storage.local.set({'enabled': 'TRUE'});
});

//newPage.js

chrome.storage.local.get('enabled', function(result){
  document.getElementById("myId").innerHTML += "<br>script loaded... and status: " + result.enabled;
});

When I do this, newPage.html displays "script loaded... and status: undefined".

Even with it being asyncronous, the storage value should be populated on running the script a second time, right?

I may just be using this incorrectly. If that's the case, what's the correct way to set something with chrome storage to access in my new window?

Any help would be appreciated!

Answer 1

I think that your newPage.html is asking for the value of 'enabled' before it's been set by the event handler in settings.html, which only executes after you've actually opened the browser popup. So this is why it's undefined. Open the popup and you should see that it's defined.