title: Why am I not getting a response in this Chrome extension message exchange?
body: <p>I'm working on a chrome extension that requires jQuery (not too familiar with jQuery). I have some messages getting passed around, but at some point it stops working and I'm not sure why. Currently on manifest v2 but working on moving to manifest v3.</p>
  <p>Here's the folder structure:</p>
  <ul>
  <li>chrome-extension
  <ul>
  <li>configs</li>
  <li>dist</li>
  <li>node_modules</li>
  <li>src
  <ul>
  <li>css</li>
  <li>js
  <ul>
  <li>internal
  <ul>
  <li><em>functions.js</em></li>
  </ul>
  </li>
  <li><em>functions.js</em></li>
  <li><em>jquery.js</em></li>
  <li><em>product.js</em></li>
  </ul>
  </li>
  <li><em>manifest.json</em></li>
  <li><em>popup.html</em></li>
  </ul>
  </li>
  </ul>
  </li>
  </ul>
  <p>When I reload the page, the extension runs this in product.js which passes a message</p>
  <pre><code>// product.js    
  
  $(function(){
        chrome.runtime.sendMessage({method: &quot;getStatus&quot;}, function(response) {
          console.log(response) //This response never happens
          if(response.status != 'true'){
            //do some stuff
            }
  </code></pre>
  <p>The message is received in functions.js</p>
  <pre><code>//functions.js    
  
  chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
          console.log(request) //logs {method: 'getStatus'}
          console.log(sender) //logs info about the tab
          console.log(window.localStorage) //logs local storage
          if (request.method == &quot;getStatus&quot;) {
            sendResponse({status: localStorage['opt-disable']}); //this sends nothing?
          } else {
            sendResponse({msg: &quot;hello&quot;}); //this is just a test
          }
      });
  </code></pre>
  <p>Back in product.js, there is no response. It seems like sendResponse in functions.js is sending a truthy/falsy value, and 'opt-disable' doesn't exist in localStorage so I would expect it to be falsy, but in the console log in product.js, nothing even shows up as a response. Why isn't the response sending?</p>
  <p>Here is manifest.json</p>
  <pre><code>{
    &quot;manifest_version&quot;: 2,
    &quot;name&quot;: &quot;Chrome Assistant DEV&quot;,
    &quot;short_name&quot;: &quot;Chrome Assistant DEV&quot;,
    &quot;description&quot;: &quot;Dev Version&quot;,
    &quot;version&quot;: &quot;2.12.1&quot;,
    &quot;permissions&quot;: [
      &quot;activeTab&quot;,
      &quot;cookies&quot;,
      &quot;identity&quot;,
      &quot;storage&quot;,
      &quot;tabs&quot;,
      &quot;webRequest&quot;,
      &quot;webRequestBlocking&quot;,
      &quot;http://*/*&quot;,
      &quot;https://*/*&quot;,
      &quot;*://*/*&quot;
    ],
    &quot;browser_action&quot;: {
      &quot;default_icon&quot;: &quot;img/icon-128.png&quot;,
      &quot;default_popup&quot;: &quot;popup.html&quot;
    },
    &quot;icons&quot;: {
      &quot;16&quot;: &quot;img/icon-16.png&quot;,
      &quot;32&quot;: &quot;img/icon-32.png&quot;,
      &quot;64&quot;: &quot;img/icon-64.png&quot;,
      &quot;128&quot;: &quot;img/icon-128.png&quot;
    },
    &quot;web_accessible_resources&quot;: [
      &quot;js/jquery.js&quot;,
      &quot;css/pagecss.css&quot;,
      &quot;js/internal/gmail_libraries.js&quot;,
      &quot;js/internal/gmail_functions.js&quot;,
      &quot;pages/oauth2_success.html&quot;
    ],
    &quot;background&quot;: {
        &quot;scripts&quot;: [
          &quot;config.js&quot;,
          &quot;js/jquery.js&quot;,
          &quot;js/developer.js&quot;,
          &quot;js/helperFn.js&quot;,
          &quot;js/functions.js&quot;,
          &quot;js/internal/functions.js&quot;,
          &quot;js/internal/results.js&quot;
        ]
     },
    &quot;content_scripts&quot;: [
      {
        &quot;matches&quot;: [&quot;http://*/*&quot;, &quot;https://*/*&quot;],
        &quot;js&quot;: [&quot;config.js&quot;, &quot;js/jquery.js&quot;, &quot;js/product.js&quot;]
      }
    ],
    &quot;content_security_policy&quot;: &quot;script-src 'self'; object-src 'self'&quot;,
    &quot;commands&quot;: {
        &quot;_execute_browser_action&quot;: {
           &quot;suggested_key&quot;: {
              &quot;default&quot;: &quot;Alt+Shift+O&quot;
           }
        },
     },
    &quot;externally_connectable&quot;: {
      &quot;ids&quot;: [&quot;*&quot;],
      &quot;matches&quot;: [
        &quot;https://mail.google.com/*&quot;
      ]
    }
  }
  </code></pre>
  <p>I'm importing many of the scripts in popup.html as well, here's the head:</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html style=&quot;height: auto;&quot;&gt;
    &lt;head&gt;
      &lt;meta charset=&quot;utf-8&quot;&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;config.js&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;js/jquery.js&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;js/typeahead.js&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;js/helperFn.js&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;js/functions.js&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;js/internal/functions.js&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;js/popup.js&quot;&gt;&lt;/script&gt;
      &lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/rebrand_2018.css&quot; /&gt;
      &lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/styles.css&quot; /&gt;
    &lt;/head&gt;
  </code></pre>