title: Failed to load file: "browser-polyfill.js"
body: <p>I was trying out this webextension-polyfill example to executeScript using tabs.executeScript and I get an error message:
  Uncaught(in promise) Failed to load file: "browser-polyfill.js"</p>
  
  <p>This is the example code I am referring to:<br>
  browser.tabs.executeScript({file: "browser-polyfill.js"});
  <a href="https://github.com/mozilla/webextension-polyfill" rel="nofollow noreferrer">https://github.com/mozilla/webextension-polyfill</a></p>
  
  <p>The same goes for the other example where I try to use browser-polyfill in the content script like:</p>
  
  <pre><code>"content_scripts": [{
  // ...
  "js": [
    "browser-polyfill.js",
    "content.js"
  ]
  }]
  </code></pre>
  
  <p>I get the error message: Could not load javascript "browser-polyfill.js" for content script. Could not load manifest</p>
  
  <p>It works in background script though and also in popup html.</p>
  
  <p>Here is my manifest file</p>
  
  <pre><code>{
    "name": "Dummy",
    "author": "UI Team at Dummy",
    "version": "1.0.0",
    "manifest_version": 2,
    "description": "Vera browser extension",
    "permissions": [
      "storage",
      "webRequest",
      "tabs",
      "webRequestBlocking",
      "storage",
      "*://*/*",
      "declarativeContent"
    ],
    "browser_action": {
      "default_popup": "popup.html",
      "default_icon": {
        "16": "images/extension_icon16.png",
        "32": "images/extension_icon32.png"
      }
    },
    "background": {
      "scripts": ["background-proprietary.js", "background.js"]
    },
    "content_scripts": [
  
      {
        "matches": ["https://*.box.com/*"],
        "js": ["content-script-box.js"],
        "all_frames": true
      },
      {
        "matches": ["https://*/*"],
        "include_globs": ["*DummyExtensionFlow=1*"],
        "js": ["browser-polyfill.js","config-sharepoint.js"],
        "all_frames": true
      }
    ],
    "icons": {
      "16": "images/extension_icon16.png",
      "32": "images/extension_icon32.png",
      "48": "images/extension_icon48.png",
      "128": "images/extension_icon128.png"
    },
    "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"
  }
  
  </code></pre>
  
  <p>Here is my popup html file which is working with webextension polyfill</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
    &lt;meta http-equiv="X-UA-Compatible" content="ie=edge"&gt;
    &lt;link rel="stylesheet" href="./popup.css"&gt;
    &lt;title&gt;Document&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;div id="root"&gt;&lt;/div&gt;
    &lt;script type="application/javascript" src="browser-polyfill.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="./popup.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  
  </code></pre>
  
  <p>What am I doing wrong?</p>