Fix typing for DOMParser

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## [next]
 
+- chore(TS): Add getDOMParserFactory to env [#8871](https://github.com/fabricjs/fabric.js/pull/8871)
 - fix(Path, Obect) Fix path parsing edge case for zeroed arc command and for too small canvas patterns [#8853](https://github.com/fabricjs/fabric.js/pull/8853)
 
 ## [6.0.0-beta3]

src/env/browser.ts

@@ -28,5 +28,6 @@ export const getEnv = (): TFabricEnv => {
       // noop
     },
     copyPasteData,
+    DOMParser: window.DOMParser,
   };
 };

src/env/index.ts

@@ -22,3 +22,5 @@ export const getEnv = () => env || getBrowserEnv();
 export const getDocument = (): Document => getEnv().document;
 
 export const getWindow = (): Window | DOMWindow => getEnv().window;
+
+export const getDOMParser = () => new (getEnv().DOMParser)();

src/env/node.ts

@@ -50,6 +50,7 @@ export const getEnv = (): TFabricEnv => {
       }
     },
     copyPasteData,
+    DOMParser: JSDOMWindow.DOMParser,
   };
 };
 

src/env/types.ts

@@ -12,4 +12,5 @@ export type TFabricEnv = {
   WebGLProbe: GLProbe;
   dispose(element: Element): void;
   copyPasteData: TCopyPasteData;
+  DOMParser: typeof DOMParser;
 };

src/parser/loadSVGFromString.ts

@@ -1,5 +1,5 @@
 //@ts-nocheck
-import { getWindow } from '../env';
+import { getDOMParser } from '../env';
 import { parseSVGDocument } from './parseSVGDocument';
 
 /**
@@ -13,7 +13,7 @@ import { parseSVGDocument } from './parseSVGDocument';
  * @param {AbortSignal} [options.signal] handle aborting, see https://developer.mozilla.org/en-US/docs/Web/API/AbortController/signal
  */
 export function loadSVGFromString(string, callback, reviver, options) {
-  const parser = new (getWindow().DOMParser)(),
+  const parser = getDOMParser(),
     doc = parser.parseFromString(string.trim(), 'text/xml');
   parseSVGDocument(
     doc.documentElement,

test/unit/env.js

@@ -22,13 +22,17 @@ QUnit.module('env', (hooks) => {
             const required = require('../../dist/index.js');
             assert.notOk(global.window, 'no window');
             assert.notOk(global.document, 'no document');
-            const win = { devicePixelRatio: 1.25 };
+            class DOMParserStub {
+
+            }
+            const win = { devicePixelRatio: 1.25, DOMParser:DOMParserStub  };
             const doc = { foo: 'bar' };
             global.window = win;
             global.document = doc;
             [imported, required].forEach(fabric => {
                 assert.equal(fabric.getEnv().window, win, 'window should match');
                 assert.equal(fabric.getEnv().document, doc, 'document should match');
+                assert.equal(fabric.getEnv().DOMParser, DOMParserStub, 'DOMParser should match');
             });
             done();
         });