refactor: join relative paths

Author: cossssmin

lib/index.js

@@ -1,3 +1,4 @@
+import path from 'pathe'
 import postcss from 'postcss'
 import isUrl from 'is-url-superb'
 import { defu as merge } from 'defu'
@@ -148,13 +149,18 @@ const plugin = (options = {}) => tree => {
   }
 
   const handleSingleValueAttributes = (node, attribute, value) => {
+    // Don't prepend to URLs
     if (isUrl(node.attrs[attribute])) {
       return node
     }
 
     node.attrs[attribute] = typeof value === 'boolean'
-      ? options.url + node.attrs[attribute]
-      : value + node.attrs[attribute]
+      ? isUrl(options.url)
+        ? options.url + node.attrs[attribute]
+        : path.join(options.url, node.attrs[attribute])
+      : isUrl(value)
+        ? value + node.attrs[attribute]
+        : path.join(value, node.attrs[attribute])
   }
 
   const prependUrl = (value, url) => {

package-lock.json

@@ -24,12 +24,12 @@
     "node": ">=18"
   },
   "scripts": {
-    "dev": "vitest",
     "build": "unbuild",
     "release": "npx np",
     "prepack": "unbuild",
     "pretest": "npm run lint",
     "lint": "biome lint ./lib",
+    "dev": "vitest --coverage",
     "test": "vitest run --coverage"
   },
   "keywords": [
@@ -48,6 +48,7 @@
   "dependencies": {
     "defu": "^6.1.4",
     "is-url-superb": "^6.1.0",
+    "pathe": "^1.1.2",
     "postcss": "^8.4.35",
     "postcss-safe-parser": "^7.0.0",
     "srcset": "^5.0.1"

package.json

@@ -0,0 +1,4 @@
+<script src="assets/test.js"></script>
+<img src="images/test.jpg">
+<img src="test.jpg">
+<img src="../test.jpg">

test/expected/joins.html

@@ -0,0 +1,4 @@
+<script src="test.js"></script>
+<img src="test.jpg">
+<img src="../test.jpg">
+<img src="../../test.jpg">

test/fixtures/joins.html

@@ -112,3 +112,17 @@ test('user-defined tags (array)', t => {
     tags: ['img', 'script'],
   })
 })
+
+test('joins relative paths', t => {
+  return process(t, 'joins', {
+    url: 'images',
+    tags: {
+      img: {
+        src: true,
+      },
+      script: {
+        src: 'assets',
+      },
+    },
+  })
+})