canChangePath

lib/svgo/tools.js

@@ -192,6 +192,27 @@ export const includesUrlReference = (body) => {
   return new RegExp(regReferencesUrl).test(body);
 };
 
+/**
+ * Checks if changing the path would cause the element to look different.
+ * @param {import('../types.js').ComputedStyles} computedStyle
+ * @returns {boolean} If it's safe to change the path.
+ */
+export const canChangePath = (computedStyle) => {
+  if (computedStyle['marker-start']) return false;
+  if (computedStyle['marker-mid']) return false;
+  if (computedStyle['marker-end']) return false;
+  if (computedStyle['clip-path']) return false;
+  if (computedStyle['mask']) return false;
+  if (computedStyle['mask-image']) return false;
+  for (const name of ['fill', 'filter', 'stroke']) {
+    const value = computedStyle[name];
+    if (value?.type == 'static' && includesUrlReference(value.value))
+      return false;
+  }
+
+  return true;
+};
+
 /**
  * @param {string} attribute
  * @param {string} value

plugins/applyTransformsShapes.js

@@ -1,5 +1,9 @@
 import { collectStylesheet, computeStyle } from '../lib/style.js';
-import { toFixed, removeLeadingZero } from '../lib/svgo/tools.js';
+import {
+  toFixed,
+  removeLeadingZero,
+  canChangePath,
+} from '../lib/svgo/tools.js';
 import { attrsGroupsDefaults } from './_collections.js';
 import { transform2js, transformsMultiply } from './_transforms.js';
 
@@ -33,6 +37,9 @@ export const fn = (root, params) => {
         ) {
           return;
         }
+        if (!canChangePath(computedStyle)) {
+          return;
+        }
 
         const transformStyle = computedStyle.transform;
         if (

plugins/mergePaths.js

@@ -9,26 +9,11 @@
 
 import { collectStylesheet, computeStyle } from '../lib/style.js';
 import { path2js, js2path, intersects } from './_path.js';
-import { includesUrlReference } from '../lib/svgo/tools.js';
+import { canChangePath } from '../lib/svgo/tools.js';
 
 export const name = 'mergePaths';
 export const description = 'merges multiple paths in one if possible';
 
-/**
- * @param {ComputedStyles} computedStyle
- * @param {string} attName
- * @returns {boolean}
- */
-function elementHasUrl(computedStyle, attName) {
-  const style = computedStyle[attName];
-
-  if (style?.type === 'static') {
-    return includesUrlReference(style.value);
-  }
-
-  return false;
-}
-
 /**
  * Merge multiple Paths into one.
  *
@@ -98,17 +83,7 @@ export const fn = (root, params) => {
           }
 
           const computedStyle = computeStyle(stylesheet, child);
-          if (
-            computedStyle['marker-start'] ||
-            computedStyle['marker-mid'] ||
-            computedStyle['marker-end'] ||
-            computedStyle['clip-path'] ||
-            computedStyle['mask'] ||
-            computedStyle['mask-image'] ||
-            ['fill', 'filter', 'stroke'].some((attName) =>
-              elementHasUrl(computedStyle, attName),
-            )
-          ) {
+          if (!canChangePath(computedStyle)) {
             if (prevPathData) {
               updatePreviousPath(prevChild, prevPathData);
             }