From 6c1e4629277b6b24dd3076aba54a8fd477bcc371 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 3 Oct 2024 13:09:53 +0200
Subject: [PATCH] fix: mark nesting selectors of global parents as used
 (#13445)

fixes #13387
---
 .../phases/2-analyze/css/css-analyze.js       | 13 ++++++++
 .../samples/global-nested-block/_config.js    | 30 ++++++++++++++-----
 .../samples/global-nested-block/expected.css  |  9 ++++++
 .../samples/global-nested-block/input.svelte  |  9 ++++++
 4 files changed, 53 insertions(+), 8 deletions(-)

diff --git a/packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js b/packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js
index 419ebf5955..88ba86cc82 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js
@@ -114,6 +114,19 @@ const css_visitors = {
 		node.metadata.used ||= node.children.every(
 			({ metadata }) => metadata.is_global || metadata.is_global_like
 		);
+
+		if (
+			node.metadata.rule?.metadata.parent_rule &&
+			node.children[0]?.selectors[0]?.type === 'NestingSelector'
+		) {
+			const parent_is_global = node.metadata.rule.metadata.parent_rule.prelude.children.some(
+				(child) => child.children.length === 1 && child.children[0].metadata.is_global
+			);
+			// mark `&:hover` in `:global(.foo) { &:hover { color: green }}` as used
+			if (parent_is_global) {
+				node.metadata.used = true;
+			}
+		}
 	},
 	RelativeSelector(node, context) {
 		node.metadata.is_global = node.selectors.length >= 1 && is_global(node);
diff --git a/packages/svelte/tests/css/samples/global-nested-block/_config.js b/packages/svelte/tests/css/samples/global-nested-block/_config.js
index 46679b8a28..adb3d4fc5f 100644
--- a/packages/svelte/tests/css/samples/global-nested-block/_config.js
+++ b/packages/svelte/tests/css/samples/global-nested-block/_config.js
@@ -2,32 +2,46 @@ import { test } from '../../test';
 
 export default test({
 	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ".unused"',
+			start: {
+				line: 19,
+				column: 3,
+				character: 204
+			},
+			end: {
+				line: 19,
+				column: 10,
+				character: 211
+			}
+		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".unused :global"',
 			start: {
-				line: 25,
+				line: 34,
 				column: 2,
-				character: 229
+				character: 332
 			},
 			end: {
-				line: 25,
+				line: 34,
 				column: 17,
-				character: 244
+				character: 347
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".unused :global(.z)"',
 			start: {
-				line: 31,
+				line: 40,
 				column: 2,
-				character: 283
+				character: 386
 			},
 			end: {
-				line: 31,
+				line: 40,
 				column: 21,
-				character: 302
+				character: 405
 			}
 		}
 	]
diff --git a/packages/svelte/tests/css/samples/global-nested-block/expected.css b/packages/svelte/tests/css/samples/global-nested-block/expected.css
index 22d855b4c6..dfc8baea33 100644
--- a/packages/svelte/tests/css/samples/global-nested-block/expected.css
+++ b/packages/svelte/tests/css/samples/global-nested-block/expected.css
@@ -8,6 +8,15 @@
 
 		.x {
 			color: green;
+			&:hover {
+				color: green;
+			}
+			&div {
+				color: green;
+			}
+			/* (unused) .unused {
+				color: red;
+			}*/
 		}
 
 		p:where(.svelte-xyz) {
diff --git a/packages/svelte/tests/css/samples/global-nested-block/input.svelte b/packages/svelte/tests/css/samples/global-nested-block/input.svelte
index 52062e158b..3d51868845 100644
--- a/packages/svelte/tests/css/samples/global-nested-block/input.svelte
+++ b/packages/svelte/tests/css/samples/global-nested-block/input.svelte
@@ -10,6 +10,15 @@
 
 		:global(.x) {
 			color: green;
+			&:hover {
+				color: green;
+			}
+			&div {
+				color: green;
+			}
+			.unused {
+				color: red;
+			}
 		}
 
 		p :global {