diff --git a/packages/vite/src/node/__tests__/utils.spec.ts b/packages/vite/src/node/__tests__/utils.spec.ts index 549371a2f395de..ac10229fc1b2e5 100644 --- a/packages/vite/src/node/__tests__/utils.spec.ts +++ b/packages/vite/src/node/__tests__/utils.spec.ts @@ -339,6 +339,20 @@ describe('processSrcSetSync', () => { expect(processSrcSetSync(base64, ({ url }) => url)).toBe(base64) }) + test('should not split the comma inside image URI', async () => { + const imageURIWithComma = + 'asset.png?param1=true,param2=false 400w, asset.png?param1=true,param2=false 800w' + expect(processSrcSetSync(imageURIWithComma, ({ url }) => url)).toBe( + imageURIWithComma, + ) + }) + + test('should handle srcset when descriptor is not present', async () => { + const srcsetNoDescriptor = 'asset.png, test.png 400w' + const result = 'asset.png, test.png 400w' + expect(processSrcSetSync(srcsetNoDescriptor, ({ url }) => url)).toBe(result) + }) + test('should not break a regular URL in srcSet', async () => { const source = 'https://anydomain/image.jpg' expect( diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts index 69f6cb0a91ab39..da754f215dac61 100644 --- a/packages/vite/src/node/utils.ts +++ b/packages/vite/src/node/utils.ts @@ -772,10 +772,17 @@ export function processSrcSetSync( } const cleanSrcSetRE = - /(?:url|image|gradient|cross-fade)\([^)]*\)|"([^"]|(?<=\\)")*"|'([^']|(?<=\\)')*'|data:\w+\/[\w.+\-]+;base64,[\w+/=]+/g + /(?:url|image|gradient|cross-fade)\([^)]*\)|"([^"]|(?<=\\)")*"|'([^']|(?<=\\)')*'|data:\w+\/[\w.+\-]+;base64,[\w+/=]+|\?\S+,/g function splitSrcSet(srcs: string) { const parts: string[] = [] - // There could be a ',' inside of url(data:...), linear-gradient(...), "data:..." or data:... + /** + * There could be a ',' inside of: + * - url(data:...) + * - linear-gradient(...) + * - "data:..." + * - data:... + * - query parameter ?... + */ const cleanedSrcs = srcs.replace(cleanSrcSetRE, blankReplacer) let startIndex = 0 let splitIndex: number