Skip to content

warningFilter stopped working with Svelte 5.10.0 #14654

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
forna opened this issue Dec 10, 2024 · 3 comments
Closed

warningFilter stopped working with Svelte 5.10.0 #14654

forna opened this issue Dec 10, 2024 · 3 comments

Comments

@forna
Copy link

forna commented Dec 10, 2024

Describe the bug

I have set the below warningFilter option in svelte.config.js.
It works up to [email protected], starting with [email protected] it has no effect.
See also: https://github.com/sveltejs/vite-plugin-svelte/issues/988

compilerOptions: {
		warningFilter(w){
			return w.message !== 'Unused CSS selector "*"'
		}
	},

Reproduction

I can reproduce it with this svelte component:

<script>
    import {Circle2} from "svelte-loading-spinners"

    // Props
    let {loadSpinner}  = $props()

    // Spinner type
    const spinnerType = "Circle2"

    // Spinner size in pixels
    const size = 70

</script>


{#if loadSpinner}
    {#if spinnerType === "Circle2"}
        <Circle2 size={size} colorOuter="#8A2BE2" colorCenter="#46B4FD" colorInner="#FFD700" durationOuter="2s" durationCenter="1.5s" durationInner="1s" />
    {/if}
{/if}


<style>
    :global {
        .circle, .wrapper {  /* .circle.svelte-1w4sjib .wrapper.svelte-7wj78d */
            position: fixed; /* Use fixed positioning to keep it in the center of the screen */
            top: 50%;
            left: 50%;
            margin-top: var(--margin-top); /* Half of the spinner size */
            margin-left: var(--margin-left); /* Half of the spinner size */
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 10000; /* Ensure it is above other content */
        }
    }
</style>

Logs

16:57:48 [vite-plugin-svelte] src/lib/components/component/Spinner.svelte:37:1 Unused CSS selector "*"

System Info

Severity

annoyance

@trueadm
Copy link
Contributor

trueadm commented Dec 10, 2024

Looks like #14629 was the likely culprit

@trueadm trueadm added the bug label Dec 10, 2024
@dummdidumm
Copy link
Member

dummdidumm commented Dec 10, 2024

The warning filter should filter by code, not by message. The message (which is not subject to versioning) changed (there's a link in a second line now). So do this instead:

compilerOptions: {
		warningFilter(w){
			return w.code !== 'css_unused_selector'
		}
	},

@dominikg I noticed that v-p-s adds a warning filter for its own injected * selector, but it needs to be updated to account for the new Svelte 5 code:

@dummdidumm
Copy link
Member

Closing since v-p-s was adjusted + see my message about code vs message etc

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants