title: content script is not showing up in Chrome Dev Tools
body: <p>I have this setting in my manifest.json:</p>
  
  <pre><code>  "content_scripts": [
      {
        "matches": ["http://*/*"],
        "css": [],
        "js": ["content-script.js"]
      }
    ],
  </code></pre>
  
  <p>here is the code in the content-script.js file:</p>
  
  <pre><code>console.log('this is the content script.');
  
  chrome.browserAction.onClicked.addListener(function(tab) {
  
    console.log('the following tab was clicked:', tab);
  
    chrome.tabs.executeScript({
      code: 'document.body.style.backgroundColor="red"'
    });
  });
  </code></pre>
  
  <p>if I click on the popup button and open the Chrome extension, and click "inspect" and open Dev Tools, I don't see any content scripts listed:</p>
  
  <p><a href="https://i.stack.imgur.com/a0OHr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/a0OHr.png" alt="enter image description here"></a></p>
  
  <p>However, now it gets really weird, because Chrome says that it can't find the manifest.json file:</p>
  
  <p><a href="https://i.stack.imgur.com/sp2gg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sp2gg.png" alt="enter image description here"></a></p>
  
  <p>However, it's clear that it could find my background.js script, which is declared in my manifest.json file:</p>
  
  <p><a href="https://i.stack.imgur.com/Ot2ko.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Ot2ko.png" alt="enter image description here"></a></p>
  
  <p>As you can see, the options page, and background page are recognized. So it seems like Chrome does recognize/detect the manifest file.</p>
  
  <p><strong>Anybody have an idea of what might be wrong? How can I get my content-scripts to be loaded?</strong></p>