feat: bump dompurify (#591)

# Motivation Resolve security warning [#39 ](https://github.com/dfinity/gix-components/security/dependabot/39) # Changes - Bump dompurify to v3.2.4 - Use renamed function `beforeSanitizeAttributes` - Remove dompurify types - Adapt test by casting and remove optional argument for contructor to resolve below issues # Issues to adapt for tests ``` src/lib/utils/html.utils.ts:54:32 - error TS7017: Element implicitly has an 'any' type because type 'typeof globalThis' has no index signature. 54 } else if (typeof global.DOMPurify.sanitize === "function") { ~~~~~~~~~ src/lib/utils/html.utils.ts:56:28 - error TS7017: Element implicitly has an 'any' type because type 'typeof globalThis' has no index signature. 56 domPurify = global.DOMPurify; ~~~~~~~~~ src/lib/utils/html.utils.ts:60:26 - error TS2769: No overload matches this call. The last overload gave the following error. Argument of type '"beforeSanitizeElements"' is not assignable to parameter of type 'DocumentFragmentHookName'. 60 domPurify?.addHook("beforeSanitizeElements", flagTargetAttributeHook); ~~~~~~~~~~~~~~~~~~~~~~~~ node_modules/dompurify/dist/purify.es.d.mts:315:5 315 addHook(entryPoint: DocumentFragmentHookName, hookFunction: DocumentFragmentHook): void; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ The last overload is declared here. vitest.setup.ts:23:26 - error TS2345: Argument of type 'Window' is not assignable to parameter of type 'WindowLike'. Type 'Window' is missing the following properties from type 'Pick<typeof globalThis, "NodeFilter" | "DOMParser" | "DocumentFragment" | "Element" | "HTMLFormElement" | "HTMLTemplateElement" | "NamedNodeMap" | "Node">': NodeFilter, DOMParser, DocumentFragment, Element, and 4 more. 23 const purify = DOMPurify(window as unknown as Window); ```
dfinity · Feb 20, 2025 · 5ac3912 · 5ac3912
1 parent 2d42dd9
commit 5ac3912
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 43 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -48,7 +48,6 @@
     "@sveltejs/vite-plugin-svelte": "^3.1.2",
     "@testing-library/jest-dom": "^6.5.0",
     "@testing-library/svelte": "^5.2.1",
-    "@types/dompurify": "^3.0.5",
     "@typescript-eslint/eslint-plugin": "^6.21.0",
     "@typescript-eslint/parser": "^6.21.0",
     "autoprefixer": "^10.4.20",
@@ -72,7 +71,7 @@
     "vitest": "^2.1.9"
   },
   "dependencies": {
-    "dompurify": "^3.1.6",
+    "dompurify": "^3.2.4",
     "html5-qrcode": "^2.3.8",
     "marked": "^9.1.0",
     "qr-creator": "^1.0.0"

diff --git a/src/lib/utils/html.utils.ts b/src/lib/utils/html.utils.ts
@@ -51,13 +51,14 @@ export const sanitize = (text: string): string => {
     if (isNullish(domPurify)) {
       if (typeof DOMPurify.sanitize === "function") {
         domPurify = DOMPurify;
+        // @ts-expect-error For testing purpose only.
       } else if (typeof global.DOMPurify.sanitize === "function") {
-        // utilize NodeJS version
-        domPurify = global.DOMPurify;
+        // @ts-expect-error For testing purpose only.
+        domPurify = global.DOMPurify as unknown as typeof DOMPurify;
       }
 
       // Preserve target="blank" workaround
-      domPurify?.addHook("beforeSanitizeElements", flagTargetAttributeHook);
+      domPurify?.addHook("beforeSanitizeAttributes", flagTargetAttributeHook);
       domPurify?.addHook("afterSanitizeAttributes", restoreTargetAttributeHook);
     }
 

diff --git a/vitest.setup.ts b/vitest.setup.ts
@@ -18,9 +18,7 @@ configure({
 
 // make `DOMPurify` available for unit tests
 import DOMPurify from "dompurify";
-import { JSDOM } from "jsdom";
-const { window } = new JSDOM("<!DOCTYPE html>");
-const purify = DOMPurify(window as unknown as Window);
+const purify = DOMPurify();
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore: used for testing only
 global.DOMPurify = purify;