allows public path to be set as a URL

Author: dzuloaga

src/utils.ts

@@ -146,7 +146,7 @@ const getOutputAndPublicPath: GetOutputAndPublicPath = (
     if (typeof configOutputPath === 'function') {
       outputPath = configOutputPath(fileName)
     } else {
-      outputPath = path.join(configOutputPath, fileName)
+      outputPath = path.posix.join(configOutputPath, fileName)
     }
   }
   let publicPath = `__webpack_public_path__ + ${JSON.stringify(outputPath)}`
@@ -155,7 +155,15 @@ const getOutputAndPublicPath: GetOutputAndPublicPath = (
     if (typeof configPublicPath === 'function') {
       publicPath = configPublicPath(fileName)
     } else {
-      publicPath = path.join(configPublicPath, fileName)
+      // publicPath can be a url or local path
+      // check if it's a valid url
+      if (isValidUrl(configPublicPath)) {
+        const url = new URL(configPublicPath)
+        url.pathname = path.posix.join(url.pathname, fileName)
+        publicPath = url.toString()
+      } else {
+        publicPath = path.posix.join(configPublicPath, fileName)
+      }
     }
     publicPath = JSON.stringify(publicPath)
   }
@@ -165,5 +173,12 @@ const getOutputAndPublicPath: GetOutputAndPublicPath = (
     publicPath,
   }
 }
+const isValidUrl = (urlString: string) => {
+  try {
+    return Boolean(new URL(urlString))
+  } catch (e) {
+    return false
+  }
+}
 
 export { parseOptions, getOutputAndPublicPath, createPlaceholder }

test/sharp/build/__snapshots__/test.js.snap

@@ -307,12 +307,12 @@ Object {
   "images": Array [
     Object {
       "height": 595,
-      "path": "foobar/6f6751159d27af0a-513.avif",
+      "path": "foobar/22e433fe295fe71f-513.avif",
       "width": 513,
     },
   ],
-  "src": "foobar/6f6751159d27af0a-513.avif",
-  "srcSet": "foobar/6f6751159d27af0a-513.avif 513w",
+  "src": "foobar/22e433fe295fe71f-513.avif",
+  "srcSet": "foobar/22e433fe295fe71f-513.avif 513w",
   "toString": [Function],
   "width": 513,
 }
@@ -324,22 +324,22 @@ Object {
   "images": Array [
     Object {
       "height": 450,
-      "path": "foobar/399c087b36a41dc7-500.avif",
+      "path": "foobar/714fef5a20dd125d-500.avif",
       "width": 500,
     },
     Object {
       "height": 675,
-      "path": "foobar/2b2c71d7c209afa8-750.avif",
+      "path": "foobar/52e04abc8f536b03-750.avif",
       "width": 750,
     },
     Object {
       "height": 900,
-      "path": "foobar/41db421bee56e18f-1000.avif",
+      "path": "foobar/9effc76d2d205f82-1000.avif",
       "width": 1000,
     },
   ],
-  "src": "foobar/41db421bee56e18f-1000.avif",
-  "srcSet": "foobar/399c087b36a41dc7-500.avif 500w,foobar/2b2c71d7c209afa8-750.avif 750w,foobar/41db421bee56e18f-1000.avif 1000w",
+  "src": "foobar/9effc76d2d205f82-1000.avif",
+  "srcSet": "foobar/714fef5a20dd125d-500.avif 500w,foobar/52e04abc8f536b03-750.avif 750w,foobar/9effc76d2d205f82-1000.avif 1000w",
   "toString": [Function],
   "width": 1000,
 }

test/utils.test.js

@@ -18,4 +18,12 @@ describe('Utils package', () => {
     expect(outputPath).toBe('dist/img/file.png')
     expect(publicPath).toBe('"public/file.png"')
   })
+
+  it('https:// slashes are kept on public path', () => {
+    const { outputPath, publicPath } = getOutputAndPublicPath('file.png', {
+      outputPath: 'dist/img/',
+      publicPath: 'https://example.com/public/',
+    })
+    expect(publicPath).toBe('"https://example.com/public/file.png"')
+  })
 })