url not handled when mixed with image-set in css multiple backgrounds

[L1Q]

Describe the bug

All url backgrounds are ignored in background-image when there is image-set present among multiple backgrounds.

By ignored I mean vite doesn't handle them, leaving the url as it was as opposed to either embeding the image or updating the url with appropriate path for dev or production. This happens in simple css templates and with sass. I haven't tested more cases.

Reproduction

https://stackblitz.com/edit/vitejs-vite-a7wff4?file=src%2Fstyle.css

Steps to reproduce

1. install a template

$ pnpm create vite -t vanilla vite-css-bug
$ cd vite-css-bug/
$ pnpm install

3. append the following to ./src/style.css:

body {
  background-image:
    image-set(url('./javascript.svg')),
    url('./javascript.svg')
    ;
  background-size: 50px 50px;
  background-position:
    20px 20px,
    70px 70px;
  background-repeat: no-repeat;
}

4. observe only one javascript logo in the top left corner
5. make background-image sources both either image-set or url
6. observe two logos

If you pnpm run build and check the dist .css file, you'll most likely find the image-set svg url inlined, while the non image-set url is left as is and the svg file is not copied to the dist directory.

vite-css-bug.tar.gz

System Info

System:
    OS: Linux 6.11 Arch Linux
    CPU: (12) x64 AMD Ryzen 5 5600U with Radeon Graphics
    Memory: 7.89 GB / 30.67 GB
    Container: Yes
    Shell: 5.2.37 - /usr/bin/bash
  Binaries:
    Node: 22.10.0 - /usr/bin/node
    npm: 10.9.0 - /usr/bin/npm
    pnpm: 9.12.2 - /usr/bin/pnpm
  npmPackages:
    vite: ^6.0.1 => 6.0.2

Used Package Manager

pnpm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[pguilbert]

I think the issue comes from the following code:

vite/packages/vite/src/node/plugins/css.ts

Line 1751 in ae68958

const rewriterToUse = isCssImageSet

Vite is expecting image-set or url but not both. We could probably chain rewriteCssImageSet and rewriteCssUrls in this case.