title: Using chrome.tabs.executeScript to execute an async function
body: <p>I have a function I want to execute in the page using <code>chrome.tabs.executeScript</code>, running from a browser action popup. The permissions are set up correctly and it works fine with a synchronous callback:</p>
  
  <pre><code>chrome.tabs.executeScript(
      tab.id, 
      { code: `(function() { 
          // Do lots of things
          return true; 
      })()` },
      r =&gt; console.log(r[0])); // Logs true
  </code></pre>
  
  <p>The problem is that the function I want to call goes through several callbacks, so I want to use <code>async</code> and <code>await</code>:</p>
  
  <pre><code>chrome.tabs.executeScript(
      tab.id, 
      { code: `(async function() { 
          // Do lots of things with await
          return true; 
      })()` },
      async r =&gt; {
          console.log(r); // Logs array with single value [Object]
          console.log(await r[0]); // Logs empty Object {}
      }); 
  </code></pre>
  
  <p>The problem is that the callback result <code>r</code>. It should be an array of script results, so I expect <code>r[0]</code> to be a promise that resolves when the script finishes.</p>
  
  <p>Promise syntax (using <code>.then()</code>) doesn't work either.</p>
  
  <p>If I execute the exact same function in the page it returns a promise as expected and can be awaited.</p>
  
  <p>Any idea what I'm doing wrong and is there any way around it?</p>