Fix lost combinator before global (#30771)

packages/next/build/swc/src/styled_jsx/transform_css.rs

@@ -138,7 +138,7 @@ impl VisitMut for Namespacer {
                         handler
                             .struct_span_err(
                                 selector.span,
-                                "Failed to parse tokens inside one off global selector",
+                                "Failed to transform one off global selector",
                             )
                             .emit()
                     });
@@ -187,6 +187,16 @@ impl Namespacer {
                                 .cloned()
                                 .collect::<Vec<_>>();
 
+                            if v.is_empty() {
+                                bail!("Failed to transform one off global selector");
+                            }
+
+                            if node.combinator.is_some() && v[0].combinator.is_some() {
+                                bail!("Failed to transform one off global selector");
+                            } else if node.combinator.is_some() {
+                                v[0].combinator = node.combinator;
+                            }
+
                             v.iter_mut().for_each(|sel| {
                                 if i < node.subclass_selectors.len() {
                                     sel.subclass_selectors

packages/next/build/swc/tests/fixture/styled-jsx/global-child-selector/input.js

@@ -0,0 +1,10 @@
+const Test = () => (
+  <div>
+    <span>test</span>
+    <style jsx>{`
+      div > :global(span) {
+        color: red;
+      }
+    `}</style>
+  </div>
+)

packages/next/build/swc/tests/fixture/styled-jsx/global-child-selector/output.js

@@ -0,0 +1,9 @@
+import _JSXStyle from "styled-jsx/style";
+const Test = ()=><div className={"jsx-5a206f122d1cb32e"}>
+
+    <span className={"jsx-5a206f122d1cb32e"}>test</span>
+
+    <_JSXStyle id={"5a206f122d1cb32e"}>{"div.jsx-5a206f122d1cb32e >span {color:red}"}</_JSXStyle>
+
+  </div>
+;