new URL(url, import.meta.url) does not work when query parameters are present

[benmccann]

Describe the bug

The following does not work because of the query parameter:

const demo = (x) => new URL(`/sample/${x}/example.jpg?abc`, import.meta.url).href

If you remove ?abc then it works again.

Here are the docs for this feature: https://vitejs.dev/guide/assets.html#new-url-url-import-meta-url

And the code for the feature: https://github.com/vitejs/vite/blob/main/packages/vite/src/node/plugins/assetImportMetaUrl.ts

Query parameters are needed to support vite-imagetools

#11157 is potentially related, but it's unclear if it's the same issue

Reproduction

https://github.com/benmccann/import.meta.url-with-query-params

Steps to reproduce

Run npm install followed by npm run dev

System Info

npmPackages:
    vite: ^4.3.2 => 4.3.3

Used Package Manager

npm

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.