:global block produces invalid css for SelectorList
#15816
:global block produces invalid css for SelectorListDevelopment PR
Regression from #15762
Fixes #15816
Before submitting the PR, please make sure you do the following
- It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs
- Prefix your PR title with
feat:,fix:,chore:, ordocs:. - This message body should clearly illustrate what problems it solves.
- Ideally, include a test that fails without this PR but passes with it.
- If this PR changes code within
packages/svelte/src, add a changeset (npx changeset).
Tests and linting
- Run the tests with
pnpm testand lint the project withpnpm lint
Issue
Solved
P
paoloricciuti Apr 22, 2025, 7:43 AMDescribe the bug
Given a component like this
<style>
:global {
a, b {
color: red;
}
}
</style>
the generated css looks like this
/* :global {*/
/* (unused) a, b*/ {
color: red;
}
/*}*/
which is wrong because there's a block without a selector.
Reproduction
Logs
System Info
Severity
annoyance
Info
Closed at Apr 22, 2025, 10:03 AM
Assignees dummdidumm
Labels None
Milestone None
P
paoloricciuti Apr 22, 2025, 7:54 AMThis is probably a regression from #15762 since now here
even if we are in a global block we still modify the code because node.children.length is greater than 1