Why UserScript's fetch intercept more requests than web-extension's fetch?

Question

I have this UserScript in TamperMonkey that I'd like to convert into an extension

let original_fetch = unsafeWindow.fetch;
unsafeWindow.fetch = async (url, init) => {
    let response = await original_fetch(url, init)
    let respo = response.clone();
    // console.log(url)
    if (url.includes("SomeString")) {
        respo.json().then((info) => {
            if (info.step === "lobby") {
                setTimeout(doSomething(info.data), 300);      
            }
        });
    }
    return response;
};

Within my extension, I injected this code with a script element:

let channel = "customChannel";
const oldFetch = window.fetch;

window.fetch = function () {
    return new Promise((resolve, reject) => {
        oldFetch
            .apply(this, arguments)
            .then(async (response) => {
                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) => {
                reject(error);
            });
    });
};

Everything works fine except for the fact that the UserScript fetches more requests than the extension.

Can someone explain why and how can I fix this?

EDIT: problem solved

my problem was caused by bad timing, the script was injected after the call was made.

Changing document.head.prepend(script); to document.documentElement.append(script); made it works as intended.

NOTE: Loading the inject script with script.src = ... or script.textContent = ... hasn't made a difference (I decided to use textContent as suggested by wOxxOm)

Thanks everyone who answered and helped me

Answer 1

Update: I missed that the code was injected using script element so the following answer relates to the difference with content script injection.

---

They are executing in different context/scope.

WebExtension content scripts are injected into content context.

Using unsafeWindow in a userscript will run the fetch in page context which is the same as webpage's own JavaScript (there are some difference between userscript mangers thought).

Without unsafeWindow, if you run fetch it will be somehow similar to WebExtension content script (again, there are some difference between userscript mangers).

In a WebExtension, if you want to run fetch in the page context, you can use window.wrappedJSObject e.g. window.wrappedJSObject.fecth()