From b8d5a73100bcec4a4422e4c988871b44b03c865c Mon Sep 17 00:00:00 2001
From: Seth Falco <seth@falco.fun>
Date: Sat, 23 Sep 2023 23:07:07 +0100
Subject: [PATCH] fix(reusePaths): pass test-regression task

Signed-off-by: Seth Falco <seth@falco.fun>
---
 plugins/reusePaths.js          | 43 +++++++++++++++++++++-------------
 test/plugins/reusePaths.01.svg |  2 +-
 test/plugins/reusePaths.02.svg |  4 ++--
 test/plugins/reusePaths.05.svg |  2 +-
 test/plugins/reusePaths.06.svg |  2 +-
 5 files changed, 32 insertions(+), 21 deletions(-)

diff --git a/plugins/reusePaths.js b/plugins/reusePaths.js
index 022b1c036..1704b16b2 100644
--- a/plugins/reusePaths.js
+++ b/plugins/reusePaths.js
@@ -1,5 +1,6 @@
 'use strict';
 
+const { collectStylesheet } = require('../lib/style');
 const { detachNodeFromParent, querySelectorAll } = require('../lib/xast');
 
 /**
@@ -22,7 +23,9 @@ exports.description =
  *
  * @type {import('./plugins-types').Plugin<'reusePaths'>}
  */
-exports.fn = () => {
+exports.fn = (root) => {
+  const stylesheet = collectStylesheet(root);
+
   /**
    * @type {Map<string, Array<XastElement>>}
    */
@@ -101,25 +104,31 @@ exports.fn = () => {
           let index = 0;
           for (const list of paths.values()) {
             if (list.length > 1) {
-              // add reusable path to defs
-              /**
-               * @type {XastElement}
-               */
+              /** @type {XastElement} */
               const reusablePath = {
                 type: 'element',
                 name: 'path',
-                attributes: { ...list[0].attributes },
+                attributes: {},
                 children: [],
               };
-              delete reusablePath.attributes.transform;
-              let id;
-              const reusablePathId = reusablePath.attributes.id;
-              if (reusablePathId == null || hrefs.has(reusablePathId)) {
-                id = 'reuse-' + index;
-                index += 1;
-                reusablePath.attributes.id = id;
+
+              for (const attr of ['fill', 'stroke', 'd']) {
+                if (list[0].attributes[attr] != null) {
+                  reusablePath.attributes[attr] = list[0].attributes[attr];
+                }
+              }
+
+              const originalId = list[0].attributes.id;
+              if (
+                originalId == null ||
+                hrefs.has(originalId) ||
+                stylesheet.rules.some(
+                  (rule) => rule.selector === `#${originalId}`
+                )
+              ) {
+                reusablePath.attributes.id = 'reuse-' + index++;
               } else {
-                id = reusablePath.attributes.id;
+                reusablePath.attributes.id = originalId;
                 delete list[0].attributes.id;
               }
               // TODO remove legacy parentNode in v4
@@ -155,7 +164,8 @@ exports.fn = () => {
                       }
                       for (const name of ['href', 'xlink:href']) {
                         if (child.attributes[name] != null) {
-                          child.attributes[name] = '#' + id;
+                          child.attributes[name] =
+                            '#' + reusablePath.attributes.id;
                         }
                       }
                     }
@@ -164,7 +174,8 @@ exports.fn = () => {
                 }
 
                 pathNode.name = 'use';
-                pathNode.attributes['xlink:href'] = '#' + id;
+                pathNode.attributes['xlink:href'] =
+                  '#' + reusablePath.attributes.id;
               }
             }
           }
diff --git a/test/plugins/reusePaths.01.svg b/test/plugins/reusePaths.01.svg
index e177f845a..ad2dd2ad0 100644
--- a/test/plugins/reusePaths.01.svg
+++ b/test/plugins/reusePaths.01.svg
@@ -18,7 +18,7 @@
 
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <defs>
-        <path id="test0" d="M 10,50 l 20,30 L 20,30"/>
+        <path d="M 10,50 l 20,30 L 20,30" id="test0"/>
         <path d="M 10,50 c 20,30 40,50 60,70 C 20,30 40,50 60,70" id="reuse-0"/>
     </defs>
     <use xlink:href="#test0"/>
diff --git a/test/plugins/reusePaths.02.svg b/test/plugins/reusePaths.02.svg
index 4e7181e5f..cd75b449a 100644
--- a/test/plugins/reusePaths.02.svg
+++ b/test/plugins/reusePaths.02.svg
@@ -11,8 +11,8 @@
 
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <defs>
-        <path id="test0" d="M 10,50 l 20,30 L 20,30"/>
-        <path id="test2" stroke="blue" d="M 10,50 l 20,30 L 20,30"/>
+        <path d="M 10,50 l 20,30 L 20,30" id="test0"/>
+        <path stroke="blue" d="M 10,50 l 20,30 L 20,30" id="test2"/>
     </defs>
     <use xlink:href="#test0"/>
     <path id="test1" stroke="red" d="M 10,50 l 20,30 L 20,30"/>
diff --git a/test/plugins/reusePaths.05.svg b/test/plugins/reusePaths.05.svg
index 7cfd410c5..5b3363446 100644
--- a/test/plugins/reusePaths.05.svg
+++ b/test/plugins/reusePaths.05.svg
@@ -24,7 +24,7 @@ an ID attribute.
         <clipPath id="c">
             <use xlink:href="#a" width="100%" height="100%" overflow="visible"/>
         </clipPath>
-        <path id="a" d="M51.94 428.2c14.5-32.39 36.88-59.5 64.38-81.96 13.76-11.23 65.04-24.09 73.86-16.58 9.45 8.06 13.45 26.18 5.53 38.45-1.23 1.9-37.38 26.83-39.1 28.32-2.19 1.9-38.65 17.58-43.76 19.51-14.02 5.28-29.47 10.43-44.31 12.71-3.19.5-14.98 3.85-16.6-.45z"/>
+        <path d="M51.94 428.2c14.5-32.39 36.88-59.5 64.38-81.96 13.76-11.23 65.04-24.09 73.86-16.58 9.45 8.06 13.45 26.18 5.53 38.45-1.23 1.9-37.38 26.83-39.1 28.32-2.19 1.9-38.65 17.58-43.76 19.51-14.02 5.28-29.47 10.43-44.31 12.71-3.19.5-14.98 3.85-16.6-.45z" id="a"/>
     </defs>
     <g transform="matrix(.491 0 0 .491 10.63 63.15)">
         <use xlink:href="#a" width="100%" height="100%" fill="#fff" fill-rule="evenodd" clip-rule="evenodd" overflow="visible"/>
diff --git a/test/plugins/reusePaths.06.svg b/test/plugins/reusePaths.06.svg
index a96d550c4..7efa7f9dd 100644
--- a/test/plugins/reusePaths.06.svg
+++ b/test/plugins/reusePaths.06.svg
@@ -23,7 +23,7 @@ in an href by another node.
 
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-29.947 60.987 69.975 102.505">
     <defs>
-        <path id="reuse-0" fill="#000" d="M0 0v1h.5Z"/>
+        <path fill="#000" d="M0 0v1h.5Z" id="reuse-0"/>
     </defs>
     <g transform="translate(-59 64)">
         <g id="b">