Handing code that uses document.createElement('script')

[is-jonreeves]

I'm using happy-dom with vitest in a React 18 SPA project. I'm not sure if this is more of a vitest question or a happy-dom one...

I have a react hook that uses document.createElement('script'), and it seems like happy-dom is attempting to make a network request when the script tag is placed on the DOM:

DOMException [NetworkError]: Fetch to "http://dummy-address/" failed. Error: The operation was aborted.
    at Fetch.onError (file:///...../node_modules/happy-dom/src/fetch/Fetch.ts:472:4

I noticed this topic so tried 'about:blank' incase it would avoid the issue, but unfortunately got this result:

DOMException [NotSupportedError]: Failed to fetch from "about:blank": URL scheme "about" is not supported.
    at Function.validateSchema (file:///...../node_modules/happy-dom/src/fetch/utilities/FetchRequestValidationUtility.ts:120:10

I also tried mocking fetch in vitest but that didn't seem to affect happy-dom (or maybe it needs to be done a different way).

What is the best way to handle the scenario where I need to place a script tag but don't want to make the actual network call?

[is-jonreeves]

I was reading through this page, and tried the following options and it seems to have silenced the errors.

window.happyDOM.settings.disableJavaScriptFileLoading = true;
window.happyDOM.settings.handleDisabledFileLoadingAsSuccess = true

I'm not sure if its the appropriate way to do it, but here is how I've implemented it in the test suite:

beforeAll(() => {
  // see https://github.com/capricorn86/happy-dom/wiki/IOptionalBrowserSettings
  vi.stubGlobal('happyDOM', merge(('happyDOM' in global) ? global.happyDOM : {}, { settings: { disableJavaScriptFileLoading: true, handleDisabledFileLoadingAsSuccess: true } }));
});

afterAll(() => {
  vi.unstubAllGlobals();
});

I will go with it for now, but let me know if I should be doing something else