Using fetch on a document without loading external javascripts and css

When I make a request to a document and check the Network Console tab, I see 5 additional requests that are (blocked:csp) that are from the initial page. This includes a googletagmanager script, gpt.js script and more.

I don’t see this behavior on ALL requests, but only on certain pages (example below).

Is there a way to block the rendering of HTML from a fetch or XML request and only load the document?

I am using a Chrome extension and running the code in the background.js

Here is a simple script that I am using:

async function fetchtest(type, url, url2=null){
        try {
            const fetchOpt = {
                method: type,
            }
            const response = await fetch(url, fetchOpt);
            if (!response.ok) {
              throw new Error(`Response status: ${response.status}`);
            }

            
      } catch (error) {
        console.error(error.message);
      }
}
fetchtest('GET', 'https://www.allrecipes.com/');

or

        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'https://www.allrecipes.com/', true);
        xhr.responseType='text';
        xhr.send();

Load either script and check your Network Console. Is there a way to prevent this?