title: Google chrome - extension chrome idle not working
body: <p>Getting ERROR: <code>Uncaught TypeError: Cannot read property 'queryState' of undefined</code></p>
  
  <p>how can i run the extension (<a href="https://developer.chrome.com/apps/idle" rel="nofollow noreferrer">https://developer.chrome.com/apps/idle</a> ) from my code?</p>
  
  <p>manifest.json:</p>
  
  <pre><code>{
    "name" : "Idle - Simple Example",
    "version" : "1.0.1",
    "description" : "Demonstrates the Idle API",
    "background" : {
      "scripts": ["background.js"]
    },
    "permissions" : [ "idle" ],
    "browser_action" : {
      "default_icon" : "sample-19.png"
    },
    "icons" : {
      "16" : "sample-16.png",
      "48" : "sample-48.png",
      "128" : "sample-128.png"
    },
    "manifest_version": 2
  }
  </code></pre>
  
  <p>background.js:</p>
  
  <pre><code>var history_log = [];
  chrome.idle.onStateChanged.addListener(function(newstate) {
    var time = new Date();
    if (history_log.length &gt;= 20) {
      history_log.pop();
    }
    history_log.unshift({'state':newstate, 'time':time});
  });
  chrome.browserAction.onClicked.addListener(function() {
    window.open('history.html', 'testwindow', 'width=700,height=600');
  });
  </code></pre>
  
  <p>FAIL: in my code to get the chrome.idle.queryState, <code>http://localhost/index.html</code>:</p>
  
  <pre><code>&lt;html&gt;
  &lt;script&gt;
  document.addEventListener('DOMContentLoaded', function() {
    chrome.idle.queryState(5, function(state) {
      var time = new Date();
      alert("extension: " + state);
    });
  
  });
  &lt;/script&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>EDIT:</strong> </p>
  
  <p>it only works when i use as chrome-extension:// but does not work if i try to use it from http:// or https://. My goal is to make it work from http:// or https:// (or iFrame opening chrome-extension invisibly if possible?)</p>
  
  <p><a href="https://i.stack.imgur.com/Ia9GV.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Ia9GV.png" alt="enter image description here"></a></p>