title: Problem stopping CORB from blocking requests
body: <p>I have a Chrome extension that scrapes some values from a webpage based on some query selectors that are provided via an API call. </p>
  
  <p>Relevant portion of manifest.json:</p>
  
  <pre><code>"background": {
      "scripts": ["js/background.js"],
      "persistent": false
    },
    "content_scripts": [
        {
            "matches": ["&lt;all_urls&gt;"],
            "js": ["js/jquery.min.js"]
        }
    ],
    "permissions": [
      "&lt;all_urls&gt;",
      "storage",
      "activeTab"
    ]
  }
  </code></pre>
  
  <p>js/background.js:
  The idea here is that if a user has entered an atsmap value on their options page, we should perform an API call.</p>
  
  <pre><code>chrome.storage.sync.get(['atsmap'], function(result) {
  if (result.atsmap) {
          var url = "https://myurl.com/AtsMapping.aspx?AtsCode=" +
          encodeURIComponent(result.atsmap)
          fetch(url).then(r =&gt; r.text()).then(text =&gt; { 
               console.log(text);
              response = JSON.stringify(text);
              chrome.storage.sync.set({"fieldmapping": response}, function() {
            console.log('Fieldmapping is set to ' + response);
          });
  
             })
  }
        return true;
      });
  </code></pre>
  
  <p>This portion appears to be working properly, here is the console from the background page:
  <a href="https://i.stack.imgur.com/5iJV2.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5iJV2.jpg" alt="enter image description here"></a></p>
  
  <p>In popup.js (which is included at the bottom of popup.html), I call an inject.js script after the DOM is loaded:</p>
  
  <pre><code>// DOM Ready
  $(() =&gt; {
  
    'use strict';
  
    chrome.tabs.executeScript({file: 'js/inject.js'}, () =&gt; {
      // We don't need to inject code everwhere
      // for example on chrome:// URIs so we just
      // catch the error and log it as a warning.
      if (chrome.runtime.lastError) {
        console.warn(chrome.runtime.lastError.message);
      }
    });
  
    // injected code will send an event with the parsed data
    chrome.runtime.onMessage.addListener(handleInjectResults);
  
  });
  </code></pre>
  
  <p>And finally, in js/inject.js, I get the value of fieldmapping from storage and attempt to use it:</p>
  
  <pre><code>(function () {
  
  
    'use strict';
  
     let fieldmap;
     let message;
  console.log("test");
  
  chrome.storage.sync.get(['atsmap'], function(result) {
  if (result.atsmap) {
      chrome.storage.sync.get(['fieldmapping'], function(result) {
          console.log('Value currently is ' + result.fieldmapping);
          fieldmap = JSON.parse(result.fieldmapping);
          console.log(fieldmap);
      // &lt;key&gt; : {              // ID of input on popup.js
      //   selector: &lt;selector&gt; // DOM selector of value in page
      //   value: &lt;value&gt;       // value to use in popup.js
      // }
  
  
      if(fieldmap.AtsMapping[4].atsMapNotes == 'John Smith (2)')  {  
      message = {
        txtLName: {
          selector: fieldmap.AtsMapping[6].lastName,
          value: null
        },
  </code></pre>
  
  <p>When I go to a demo page that I've setup for the scraping, then click my extension icon, rather than scraping the page for the form values, I get the following in the console:
  <a href="https://i.stack.imgur.com/sQJsH.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sQJsH.jpg" alt="enter image description here"></a></p>
  
  <p>I don't understand how, on inject.js line 32, I can <code>console.log(fieldmap);</code> and get what appears to be the proper response, and yet on inject.js line 39, the same fieldmap is undefined.</p>
  
  <p>Any suggestions would be helpful as I'm completely lost here.</p>