fix: Allow global-like pseudo-selectors refinement (#15313)

For instance, specifying a tree-structural pseudo-class to
`::view-transition-new` should still constitute a valid global-like
selector.

Fixes #15312

---------

Co-authored-by: Simon H <[email protected]>

Author: ccjmne

.changeset/gold-hairs-jog.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: allow global-like pseudo-selectors refinement

packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js

@@ -133,7 +133,13 @@ const css_visitors = {
 
 		node.metadata.is_global = node.selectors.length >= 1 && is_global(node);
 
-		if (node.selectors.length === 1) {
+		if (
+			node.selectors.length >= 1 &&
+			node.selectors.every(
+				(selector) =>
+					selector.type === 'PseudoClassSelector' || selector.type === 'PseudoElementSelector'
+			)
+		) {
 			const first = node.selectors[0];
 			node.metadata.is_global_like ||=
 				(first.type === 'PseudoClassSelector' && first.name === 'host') ||

packages/svelte/tests/css/samples/view-transition/expected.css

@@ -8,9 +8,15 @@
 	::view-transition-old {
 		animation-duration: 0.5s;
 	}
+	::view-transition-old:only-child {
+		animation-duration: 0.5s;
+	}
 	::view-transition-new {
 		animation-duration: 0.5s;
 	}
+	::view-transition-new:only-child {
+		animation-duration: 0.5s;
+	}
 	::view-transition-image-pair {
 		animation-duration: 0.5s;
 	}

packages/svelte/tests/css/samples/view-transition/input.svelte

@@ -8,9 +8,15 @@
 	::view-transition-old {
 		animation-duration: 0.5s;
 	}
+	::view-transition-old:only-child {
+		animation-duration: 0.5s;
+	}
 	::view-transition-new {
 		animation-duration: 0.5s;
 	}
+	::view-transition-new:only-child {
+		animation-duration: 0.5s;
+	}
 	::view-transition-image-pair {
 		animation-duration: 0.5s;
 	}