fix: allow global next to & for nesting

Author: paoloricciuti

.changeset/selfish-panthers-add.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: allow global next to `&` for nesting

packages/svelte/src/compiler/phases/3-transform/css/index.js

@@ -239,6 +239,12 @@ const visitors = {
 				}
 
 				if (relative_selector.selectors.some((s) => s.type === 'NestingSelector')) {
+					// clean every global selector attached to Nesting before bailing out
+					for (const selector of relative_selector.selectors) {
+						if (selector.type === 'PseudoClassSelector' && selector.name === 'global') {
+							remove_global_pseudo_class(selector);
+						}
+					}
 					continue;
 				}
 

packages/svelte/tests/css/samples/global-with-nesting/_config.js

@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: []
+});

packages/svelte/tests/css/samples/global-with-nesting/expected.css

@@ -0,0 +1,5 @@
+	div.svelte-xyz {
+		&.class{
+			color: red;
+		}
+	}

packages/svelte/tests/css/samples/global-with-nesting/expected.html

@@ -0,0 +1,2 @@
+<div class="svelte-xyz">
+</div>

packages/svelte/tests/css/samples/global-with-nesting/input.svelte

@@ -0,0 +1,10 @@
+<style>
+	div {
+		&:global(.class){
+			color: red;
+		}
+	}
+</style>
+
+<div>
+</div>