From 1543993b465bfb0a08fc94d66e2adacd1046ff9e Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 13 Feb 2024 16:32:45 -0500
Subject: [PATCH] comment out rules with unused/empty children

---
 .../phases/2-analyze/css/Stylesheet.js        | 48 ++++++++++++-------
 .../tests/css/samples/nested-css/_config.js   |  7 +++
 .../tests/css/samples/nested-css/expected.css |  4 +-
 3 files changed, 39 insertions(+), 20 deletions(-)
 create mode 100644 packages/svelte/tests/css/samples/nested-css/_config.js

diff --git a/packages/svelte/src/compiler/phases/2-analyze/css/Stylesheet.js b/packages/svelte/src/compiler/phases/2-analyze/css/Stylesheet.js
index dc63dab0fc..4239f797c5 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/css/Stylesheet.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/css/Stylesheet.js
@@ -113,20 +113,35 @@ class Rule {
 	}
 
 	/**
-	 * @param {boolean} dev
 	 * @returns {boolean}
 	 */
-	is_used(dev) {
-		if (this.parent && this.parent.node.type === 'Atrule' && is_keyframes_node(this.parent.node))
+	is_empty() {
+		if (this.declarations.length > 0) return false;
+
+		for (const rule of this.nested_rules) {
+			if (rule.is_used() && !rule.is_empty()) return false;
+		}
+
+		return true;
+	}
+
+	/**
+	 * @returns {boolean}
+	 */
+	is_used() {
+		if (this.parent && this.parent.node.type === 'Atrule' && is_keyframes_node(this.parent.node)) {
 			return true;
+		}
 
-		// keep empty rules in dev, because it's convenient to
-		// see them in devtools
-		if (this.declarations.length === 0) return dev;
+		for (const selector of this.selectors) {
+			if (selector.used) return true;
+		}
+
+		for (const rule of this.nested_rules) {
+			if (rule.is_used()) return true;
+		}
 
-		return [this.selectors.some((s) => s.used), this.nested_rules.some((r) => r.is_used(dev))].some(
-			Boolean
-		);
+		return false;
 	}
 
 	/**
@@ -176,13 +191,10 @@ class Rule {
 
 		// keep empty rules in dev, because it's convenient to
 		// see them in devtools
-		if (this.declarations.length === 0 && this.nested_rules.length === 0) {
-			if (!dev) {
-				code.prependRight(this.node.start, '/* (empty) ');
-				code.appendLeft(this.node.end, '*/');
-				escape_comment_close(this.node, code);
-			}
-
+		if (!dev && this.is_empty()) {
+			code.prependRight(this.node.start, '/* (empty) ');
+			code.appendLeft(this.node.end, '*/');
+			escape_comment_close(this.node, code);
 			return;
 		}
 
@@ -228,9 +240,9 @@ class Rule {
 			}
 		}
 
-		this.nested_rules.forEach((rule) => {
+		for (const rule of this.nested_rules) {
 			rule.prune(code, dev);
-		});
+		}
 	}
 }
 
diff --git a/packages/svelte/tests/css/samples/nested-css/_config.js b/packages/svelte/tests/css/samples/nested-css/_config.js
new file mode 100644
index 0000000000..53ebc0cee8
--- /dev/null
+++ b/packages/svelte/tests/css/samples/nested-css/_config.js
@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: false
+	}
+});
diff --git a/packages/svelte/tests/css/samples/nested-css/expected.css b/packages/svelte/tests/css/samples/nested-css/expected.css
index 763cf0d0e3..b82579d918 100644
--- a/packages/svelte/tests/css/samples/nested-css/expected.css
+++ b/packages/svelte/tests/css/samples/nested-css/expected.css
@@ -20,9 +20,9 @@
 		}
 
 		/* (empty) .d:where(.svelte-xyz) {
-			/* (unused) .unused {
+			.unused {
 				color: red;
-			}*\/
+			}
 		}*/
 
 		/* explicit & */