title: Why UserScript's fetch intercept more requests than web-extension's fetch?
body: <p>I have this <code>UserScript</code> in <code>TamperMonkey</code> that I'd like to convert into an extension</p>
  <pre><code>let original_fetch = unsafeWindow.fetch;
  unsafeWindow.fetch = async (url, init) =&gt; {
      let response = await original_fetch(url, init)
      let respo = response.clone();
      // console.log(url)
      if (url.includes(&quot;SomeString&quot;)) {
          respo.json().then((info) =&gt; {
              if (info.step === &quot;lobby&quot;) {
                  setTimeout(doSomething(info.data), 300);      
              }
          });
      }
      return response;
  };
  </code></pre>
  <p>Within my extension, I injected this code with a <code>script</code> element:</p>
  <pre><code>let channel = &quot;customChannel&quot;;
  const oldFetch = window.fetch;
  
  window.fetch = function () {
      return new Promise((resolve, reject) =&gt; {
          oldFetch
              .apply(this, arguments)
              .then(async (response) =&gt; {
                  const json = await response.clone().json();
  
                  const detail = {
                      json,
                      fetch: {
                          url: response.url,
                          status: response.status,
                      },
                  };
  
                  window.dispatchEvent(new CustomEvent(channel, { detail }));
  
                  resolve(response);
              })
              .catch((error) =&gt; {
                  reject(error);
              });
      });
  };
  </code></pre>
  <p>Everything works fine except for the fact that the <code>UserScript</code> fetches more requests than the extension.</p>
  <p>Can someone explain why and how can I fix this?</p>
  <p><strong>EDIT: problem solved</strong></p>
  <p>my problem was caused by bad timing, the script was injected after the call was made.</p>
  <p>Changing <code>document.head.prepend(script);</code> to <code>document.documentElement.append(script);</code> made it works as intended.</p>
  <p>NOTE: Loading the inject script with <code>script.src = ...</code> or <code>script.textContent = ...</code> hasn't made a difference (I decided to use <code>textContent</code> as suggested by wOxxOm)</p>
  <p>Thanks everyone who answered and helped me</p>