fix: avoid multiple instances of svgdom/svg.js

axe312ger · Mar 22, 2024 · 71108f3 · 71108f3
1 parent 4d931fd
commit 71108f3
Show file tree

Hide file tree

Showing 10 changed files with 36 additions and 97 deletions.
diff --git a/packages/sqip-plugin-blur/package.json b/packages/sqip-plugin-blur/package.json
@@ -27,8 +27,6 @@
     "url": "https://github.com/axe312ger/sqip/issues"
   },
   "dependencies": {
-    "@svgdotjs/svg.js": "^3.0.16",
-    "sqip": "^1.0.0-alpha.49",
-    "svgdom": "^0.1.19"
+    "sqip": "^1.0.0-alpha.49"
   }
 }
diff --git a/packages/sqip-plugin-blur/src/sqip-plugin-blur.ts b/packages/sqip-plugin-blur/src/sqip-plugin-blur.ts
@@ -6,8 +6,6 @@ import {
   SqipCliOptionDefinition
 } from 'sqip'
 
-import { SVG, registerWindow } from '@svgdotjs/svg.js'
-
 interface BlurPluginOptions extends SqipPluginOptions {
   options: BlurOptions
 }
@@ -48,13 +46,7 @@ export default class SVGPlugin extends SqipPlugin {
       return svg
     }
 
-    const { createSVGWindow } = await import('svgdom')
-    const window = createSVGWindow()
-    const document = window.document
-
-    registerWindow(window, document)
-
-    const canvas = await loadSVG(svg)
+    const {svg: canvas, SVG} = await loadSVG(svg)
     const blurFilterId = 'b'
     const group = SVG(`<g filter="url(#${blurFilterId})"/>`)
 

diff --git a/packages/sqip-plugin-blurhash/package.json b/packages/sqip-plugin-blurhash/package.json
@@ -29,8 +29,5 @@
     "blurhash": "^2.0.5",
     "sharp": "^0.32.0",
     "sqip": "^1.0.0-alpha.49"
-  },
-  "devDependencies": {
-    "@types/svgdom": "^0.1.2"
   }
 }
diff --git a/packages/sqip-plugin-pixels/package.json b/packages/sqip-plugin-pixels/package.json
@@ -26,13 +26,10 @@
     "url": "https://github.com/axe312ger/sqip/issues"
   },
   "dependencies": {
-    "@svgdotjs/svg.js": "^3.0.16",
     "sharp": "^0.32.0",
-    "sqip": "^1.0.0-alpha.49",
-    "svgdom": "^0.1.13"
+    "sqip": "^1.0.0-alpha.49"
   },
   "devDependencies": {
-    "@types/svgdom": "^0.1.2",
     "cheerio": "1.0.0-rc.12"
   }
 }
diff --git a/packages/sqip-plugin-primitive/src/sqip-plugin-primitive.ts b/packages/sqip-plugin-primitive/src/sqip-plugin-primitive.ts
@@ -173,7 +173,7 @@ export default class PrimitivePlugin extends SqipPlugin {
       }
     )
 
-    const canvas = await loadSVG(result.stdout)
+    const { svg: canvas } = await loadSVG(result.stdout)
 
     const bgRect = canvas.findOne('rect:first-child[fill]')
 

diff --git a/packages/sqip-plugin-triangle/package.json b/packages/sqip-plugin-triangle/package.json
@@ -29,7 +29,6 @@
     "url": "https://github.com/axe312ger/sqip/issues"
   },
   "dependencies": {
-    "@svgdotjs/svg.js": "^3.0.16",
     "debug": "^4.3.4",
     "execa": "5.1.1",
     "sqip": "^1.0.0-alpha.49"

diff --git a/packages/sqip-plugin-triangle/src/sqip-plugin-triangle.ts b/packages/sqip-plugin-triangle/src/sqip-plugin-triangle.ts
@@ -15,8 +15,6 @@ import {
   parseColor
 } from 'sqip'
 
-import { SVG } from '@svgdotjs/svg.js'
-
 interface TrianglePluginOptions extends SqipPluginOptions {
   options: Partial<TriangleOptions>
 }
@@ -197,7 +195,7 @@ export default class TrianglePlugin extends SqipPlugin {
     await unlink(tmpFile)
     await unlink(tmpSvgFile)
 
-    const canvas = await loadSVG(
+    const { svg: canvas, SVG } = await loadSVG(
       result
         .toString()
         .replace(/<!DOCTYPE[^>]+>/, '')

diff --git a/packages/sqip/__tests__/unit/helpers.test.ts b/packages/sqip/__tests__/unit/helpers.test.ts
@@ -11,8 +11,8 @@ const FILE_SVG = resolve(DIR_FIXTURES, 'beach-sqip.svg')
 
 test('loadSVG', async () => {
   const svgContentBuffer = await readFile(FILE_SVG)
-  const $svg = await loadSVG(svgContentBuffer.toString())
-  expect($svg).toBeDefined()
+  const { svg } = await loadSVG(svgContentBuffer.toString())
+  expect(svg).toBeDefined()
 })
 
 const cleanResultArray = (results: string[]) =>

diff --git a/packages/sqip/src/helpers.ts b/packages/sqip/src/helpers.ts
@@ -1,6 +1,6 @@
 import path from 'path'
 
-import { SVG, registerWindow } from '@svgdotjs/svg.js'
+import { SVG, registerWindow, Element } from '@svgdotjs/svg.js'
 import Debug from 'debug'
 import expandTilde from 'expand-tilde'
 import fastGlob from 'fast-glob'
@@ -10,13 +10,15 @@ import type { Palette } from '@behold/sharp-vibrant/lib/color'
 
 const debug = Debug('sqip')
 
-export const loadSVG = async (svg: string) => {
+export const loadSVG = async (
+  svg: string
+): Promise<{ svg: Element; SVG: typeof SVG }> => {
   const { createSVGWindow } = await import('svgdom')
   const window = createSVGWindow()
   const document = window.document
   registerWindow(window, document)
 
-  return SVG(svg)
+  return { svg: SVG(svg), SVG }
 }
 
 export function isError(error: unknown): error is NodeJS.ErrnoException {

diff --git a/yarn.lock b/yarn.lock
@@ -1796,19 +1796,11 @@
   dependencies:
     "@sinonjs/commons" "^1.7.0"
 
-"@svgdotjs/svg.js@^3.0.16", "@svgdotjs/svg.js@^3.2.0":
+"@svgdotjs/svg.js@^3.2.0":
   version "3.2.0"
   resolved "https://registry.npmjs.org/@svgdotjs/svg.js/-/svg.js-3.2.0.tgz"
   integrity sha512-Tr8p+QVP7y+QT1GBlq1Tt57IvedVH8zCPoYxdHLX0Oof3a/PqnC/tXAkVufv1JQJfsDHlH/UrjcDfgxSofqSNA==
 
-"@swc/helpers@^0.4.2":
-  version "0.4.36"
-  resolved "https://registry.yarnpkg.com/@swc/helpers/-/helpers-0.4.36.tgz#fcfff76ed52c214f357e8e9d3f37b568908072d9"
-  integrity sha512-5lxnyLEYFskErRPenYItLRSge5DjrJngYKdVjRSrWfza9G6KkgHEXi0vUZiyUeMU5JfXH1YnvXZzSp8ul88o2Q==
-  dependencies:
-    legacy-swc-helpers "npm:@swc/helpers@=0.4.14"
-    tslib "^2.4.0"
-
 "@tootallnate/once@1":
   version "1.1.2"
   resolved "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz"
@@ -1965,6 +1957,11 @@
   dependencies:
     undici-types "~5.26.4"
 
+"@types/[email protected]":
+  version "16.9.1"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-16.9.1.tgz#0611b37db4246c937feef529ddcc018cf8e35708"
+  integrity sha512-QpLcX9ZSsq3YYUUnD3nFDY8H7wctAhQj/TFKL8Ya8v5fMm3CFXxo8zStsLAl780ltoYoo1WvKUVGBQK+1ifr7g==
+
 "@types/node@^10.11.7":
   version "10.17.0"
   resolved "https://registry.npmjs.org/@types/node/-/node-10.17.0.tgz"
@@ -2855,13 +2852,6 @@ brotli@^1.2.0:
   dependencies:
     base64-js "^1.1.2"
 
-brotli@^1.3.2:
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/brotli/-/brotli-1.3.3.tgz#7365d8cc00f12cf765d2b2c898716bcf4b604d48"
-  integrity sha512-oTKjJdShmDuGW94SyyaoQvAjf30dZaHnjJ8uAF+u2/vGJkJbJPJAT1gDiOJP5v1Zb6f9KEyW/1HpuaWIXtGHPg==
-  dependencies:
-    base64-js "^1.1.2"
-
 browser-resolve@^1.8.1:
   version "1.11.3"
   resolved "https://registry.npmjs.org/browser-resolve/-/browser-resolve-1.11.3.tgz"
@@ -3270,11 +3260,6 @@ clone@^1.0.2, clone@^1.0.4:
   resolved "https://registry.npmjs.org/clone/-/clone-1.0.4.tgz"
   integrity sha1-2jCcwmPfFZlMaIypAheco8fNfH4=
 
-clone@^2.1.2:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/clone/-/clone-2.1.2.tgz#1b7f4b9f591f1e8f83670401600345a02887435f"
-  integrity sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==
-
 cmd-shim@^4.1.0:
   version "4.1.0"
   resolved "https://registry.npmjs.org/cmd-shim/-/cmd-shim-4.1.0.tgz"
@@ -5097,21 +5082,6 @@ fontkit@^1.8.1:
     unicode-properties "^1.2.2"
     unicode-trie "^0.3.0"
 
-fontkit@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/fontkit/-/fontkit-2.0.2.tgz#ac5384f3ecab8327c6d2ea2e4d384afc544b48fd"
-  integrity sha512-jc4k5Yr8iov8QfS6u8w2CnHWVmbOGtdBtOXMze5Y+QD966Rx6PEVWXSEGwXlsDlKtu1G12cJjcsybnqhSk/+LA==
-  dependencies:
-    "@swc/helpers" "^0.4.2"
-    brotli "^1.3.2"
-    clone "^2.1.2"
-    dfa "^1.2.0"
-    fast-deep-equal "^3.1.3"
-    restructure "^3.0.0"
-    tiny-inflate "^1.0.3"
-    unicode-properties "^1.4.0"
-    unicode-trie "^2.0.0"
-
 for-each@^0.3.3:
   version "0.3.3"
   resolved "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz"
@@ -5362,6 +5332,14 @@ [email protected]:
     fs-extra "^11.1.1"
     globby "^6.1.0"
 
+gifwrap@^0.10.1:
+  version "0.10.1"
+  resolved "https://registry.yarnpkg.com/gifwrap/-/gifwrap-0.10.1.tgz#9ed46a5d51913b482d4221ce9c727080260b681e"
+  integrity sha512-2760b1vpJHNmLzZ/ubTtNnEx5WApN/PYWJvXvgS+tL1egTTthayFYIQQNi136FLEDcN/IyEY2EcGpIITD6eYUw==
+  dependencies:
+    image-q "^4.0.0"
+    omggif "^1.0.10"
+
 git-raw-commits@^2.0.8:
   version "2.0.10"
   resolved "https://registry.npmjs.org/git-raw-commits/-/git-raw-commits-2.0.10.tgz"
@@ -5864,6 +5842,13 @@ ignore@^5.2.0, ignore@^5.2.4:
   resolved "https://registry.npmjs.org/ignore/-/ignore-5.3.1.tgz"
   integrity sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw==
 
+image-q@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/image-q/-/image-q-4.0.0.tgz#31e075be7bae3c1f42a85c469b4732c358981776"
+  integrity sha512-PfJGVgIfKQJuq3s0tTDOKtztksibuUEbJQIYT3by6wctQo+Rdlh7ef4evJ5NCdxY4CfMbvFkocEwbl4BF8RlJw==
+  dependencies:
+    "@types/node" "16.9.1"
+
 image-size@^0.6.1:
   version "0.6.3"
   resolved "https://registry.npmjs.org/image-size/-/image-size-0.6.3.tgz"
@@ -7023,13 +7008,6 @@ kleur@^3.0.3:
   resolved "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz"
   integrity sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==
 
-"legacy-swc-helpers@npm:@swc/helpers@=0.4.14":
-  version "0.4.14"
-  resolved "https://registry.yarnpkg.com/@swc/helpers/-/helpers-0.4.14.tgz#1352ac6d95e3617ccb7c1498ff019654f1e12a74"
-  integrity sha512-4C7nX/dvpzB7za4Ql9K81xK3HPxCpHMgwTZVyf+9JQ6VUbn9jjZVN7/Nkdz/Ugzs2CSjqnL/UPXroiVBVHUWUw==
-  dependencies:
-    tslib "^2.4.0"
-
 [email protected]:
   version "4.0.0"
   resolved "https://registry.npmjs.org/lerna/-/lerna-4.0.0.tgz"
@@ -8135,7 +8113,7 @@ object.values@^1.1.7:
     define-properties "^1.2.0"
     es-abstract "^1.22.1"
 
-omggif@^1.0.9:
+omggif@^1.0.10, omggif@^1.0.9:
   version "1.0.10"
   resolved "https://registry.yarnpkg.com/omggif/-/omggif-1.0.10.tgz#ddaaf90d4a42f532e9e7cb3a95ecdd47f17c7b19"
   integrity sha512-LMJTtvgc/nugXj0Vcrrs68Mn2D1r0zf630VNtqtpI1FEO7e+O9FP4gqs9AcnBaSEeoHIPm28u6qgPR0oyEpGSw==
@@ -9228,11 +9206,6 @@ restructure@^0.5.3:
   dependencies:
     browserify-optional "^1.0.0"
 
-restructure@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/restructure/-/restructure-3.0.1.tgz#d610105f09978a42c806c1fc2048ff56900e6a21"
-  integrity sha512-6neDpI/yE9eogQo22qmWwKIA9wFPRyYjQleDEh6zaNAf2ZPqLJYUvNBJBWEWNoBlCeQMQkvIOe2YI/K2GOag+g==
-
 ret@~0.1.10:
   version "0.1.15"
   resolved "https://registry.npmjs.org/ret/-/ret-0.1.15.tgz"
@@ -10067,15 +10040,6 @@ svgdom@^0.1.13:
     image-size "^1.0.2"
     sax "^1.2.4"
 
-svgdom@^0.1.19:
-  version "0.1.19"
-  resolved "https://registry.yarnpkg.com/svgdom/-/svgdom-0.1.19.tgz#9f9c311e46ed3f5897a547fd939a7eb5bd6a21ae"
-  integrity sha512-gBvlZ74RECaG9VyPrj9OdakOarEKKvaXh5NVkbx9oWfAo4XnQehk75b14iOW2UjFHyZThczZ1NrPV9rDrecOVg==
-  dependencies:
-    fontkit "^2.0.2"
-    image-size "^1.0.2"
-    sax "^1.2.4"
-
 svgo@^0.7.2:
   version "0.7.2"
   resolved "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz"
@@ -10313,7 +10277,7 @@ timm@^1.6.1:
   resolved "https://registry.npmjs.org/timm/-/timm-1.7.1.tgz"
   integrity sha512-IjZc9KIotudix8bMaBW6QvMuq64BrJWFs1+4V0lXwWGQZwH+LnX87doAYhem4caOEusRP9/g6jVDQmZ8XOk1nw==
 
-tiny-inflate@^1.0.0, tiny-inflate@^1.0.2, tiny-inflate@^1.0.3:
+tiny-inflate@^1.0.0, tiny-inflate@^1.0.2:
   version "1.0.3"
   resolved "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.3.tgz"
   integrity sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw==
@@ -10448,7 +10412,7 @@ tslib@^1.8.1, tslib@^1.9.0:
   resolved "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
-tslib@^2.4.0, tslib@^2.6.2:
+tslib@^2.6.2:
   version "2.6.2"
   resolved "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz"
   integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
@@ -10646,14 +10610,6 @@ unicode-properties@^1.2.2:
     base64-js "^1.3.0"
     unicode-trie "^2.0.0"
 
-unicode-properties@^1.4.0:
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/unicode-properties/-/unicode-properties-1.4.1.tgz#96a9cffb7e619a0dc7368c28da27e05fc8f9be5f"
-  integrity sha512-CLjCCLQ6UuMxWnbIylkisbRj31qxHPAurvena/0iwSVbQ2G1VY5/HjV0IRabOEbDHlzZlRdCrD4NhB0JtU40Pg==
-  dependencies:
-    base64-js "^1.3.0"
-    unicode-trie "^2.0.0"
-
 unicode-trie@^0.3.0:
   version "0.3.1"
   resolved "https://registry.npmjs.org/unicode-trie/-/unicode-trie-0.3.1.tgz"
-Original file line number
+Diff line change
@@ Expand Up / @@ -173,7 +173,7 @@ export default class PrimitivePlugin extends SqipPlugin { @@
           }
         )
-        const canvas = await loadSVG(result.stdout)
+        const { svg: canvas } = await loadSVG(result.stdout)
         const bgRect = canvas.findOne('rect:first-child[fill]')
@@ Expand Down @@