From f52a30347f2dc91f23127a6d2271e4f66931bada Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 12:09:47 +0100
Subject: [PATCH] fix: ensure comma is also pruned if necessary (#14032)

immediately after merging #14006 I noticed there's a bug when pruning one selector in a list of several; this fixes it

no changeset because not released yet
---
 .../compiler/phases/3-transform/css/index.js  | 12 ++++++----
 .../css-injected-options-minify/_config.js    |  8 +++++++
 .../_expected.html                            |  1 +
 .../_expected_head.html                       |  1 +
 .../css-injected-options-minify/main.svelte   | 23 +++++++++++++++++++
 .../css-injected-options-nested/Nested.svelte |  5 ----
 .../_expected.html                            |  2 +-
 .../_expected_head.html                       |  2 +-
 8 files changed, 43 insertions(+), 11 deletions(-)
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_config.js
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte

diff --git a/packages/svelte/src/compiler/phases/3-transform/css/index.js b/packages/svelte/src/compiler/phases/3-transform/css/index.js
index 6f87b04850..5b40867aab 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -214,11 +214,15 @@ const visitors = {
 							state.code.overwrite(i, i + 1, '*/');
 						}
 					} else {
-						prune_start = selector.start;
-
-						if (!state.minify) {
-							if (i === 0) {
+						if (i === 0) {
+							if (state.minify) {
+								prune_start = selector.start;
+							} else {
 								state.code.prependRight(selector.start, '/* (unused) ');
+							}
+						} else {
+							if (state.minify) {
+								prune_start = last;
 							} else {
 								state.code.overwrite(last, selector.start, ' /* (unused) ');
 							}
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_config.js b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_config.js
new file mode 100644
index 0000000000..e1a14af601
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	// test checks that minification works correctly
+	compileOptions: {
+		css: 'external'
+	}
+});
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
new file mode 100644
index 0000000000..caa872be9b
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
@@ -0,0 +1 @@
+<!--[--><div class="foo svelte-mnmfn6">foo</div><!--]-->
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
new file mode 100644
index 0000000000..8d6e42d979
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
@@ -0,0 +1 @@
+<style id="svelte-mnmfn6">.foo.svelte-mnmfn6 {color:green;}.foo.svelte-mnmfn6 {color:green;}</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte
new file mode 100644
index 0000000000..13e01788e2
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte
@@ -0,0 +1,23 @@
+<svelte:options css="injected" />
+
+<div class="foo">foo</div>
+
+<style>
+	.foo {
+		color: green;
+	}
+	.unused {
+		color: red;
+	}
+	.unused {
+		.nested-unused {
+			color: red;
+		}
+	}
+	.unused:has(.unused) {
+		color: red;
+	}
+	.foo, .unused {
+		color: green;
+	}
+</style>
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
index 7b6038eef3..81243bf114 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
@@ -6,9 +6,4 @@
 	.bar {
 		color: red;
 	}
-	.unused {
-		.also-unused {
-			color: green;
-		}
-	}
 </style>
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
index 3069a50ad7..1f0b2b95fe 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
@@ -1 +1 @@
-<!--[--><div class="bar svelte-1fs6vx">bar</div><!----> <div class="foo svelte-sg04hs">foo</div><!--]-->
\ No newline at end of file
+<!--[--><div class="bar svelte-ievf05">bar</div><!----> <div class="foo svelte-sg04hs">foo</div><!--]-->
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
index 6474fde317..6d795670ff 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
@@ -1 +1 @@
-<style id="svelte-1fs6vx">.bar.svelte-1fs6vx {color:red;}</style>
\ No newline at end of file
+<style id="svelte-ievf05">.bar.svelte-ievf05 {color:red;}</style>
\ No newline at end of file