Repository: swc-project/swc (rust)

Issue:
[css modules] Using `:global` and Attribute Selector at the same time breaks output
### Describe the bug

Using `:global` and Attribute Selector at the same time breaks output.
Transfered from https://github.com/web-infra-dev/rspack/issues/3777

### Input code

```typescript
.class:global[data-x=true] > .inner {
    color: red;
}

.class[data-x=true]:global > .inner {
    color: yellow;
}
```


### Config

```json
none
```


### Playground link

_No response_

### Expected behavior

```css
.__local__class[data-x=true] > .inner {
  color: red;
}
.__local__class[data-x=true] > .inner {
  color: yellow;
}
```

### Actual behavior

```css
/* attribute selector is disappear */
.__local__class > .inner {
  color: red;
}
.__local__class[data-x=true] > .inner {
  color: yellow;
}
```

### Version

1.3.70

### Additional context

_No response_

Pull request description:
fix(css/modules): Preserve attribute selectors used with `:global`
**Description:**

**Related issue:**

 - Closes #7669 

Patch:
diff --git a/crates/swc_css_modules/src/lib.rs b/crates/swc_css_modules/src/lib.rs
index c996ef049f..81f4da7056 100644
--- a/crates/swc_css_modules/src/lib.rs
+++ b/crates/swc_css_modules/src/lib.rs
@@ -512,8 +512,7 @@ where
                                 } else {
                                     if sel_index > 0 {
                                         if let Some(n) = n.as_mut_compound_selector() {
-                                            n.subclass_selectors =
-                                                n.subclass_selectors.split_at(sel_index).0.to_vec();
+                                            n.subclass_selectors.remove(sel_index);
                                         }
                                         new_children.push(n);
                                     }
@@ -539,8 +538,7 @@ where
                                 } else {
                                     if sel_index > 0 {
                                         if let Some(n) = n.as_mut_compound_selector() {
-                                            n.subclass_selectors =
-                                                n.subclass_selectors.split_at(sel_index).0.to_vec();
+                                            n.subclass_selectors.remove(sel_index);
                                         }
                                         new_children.push(n);
                                     }


Test patch:
diff --git a/crates/swc_css_modules/tests/fixture/issues/issue-7669.compiled.css b/crates/swc_css_modules/tests/fixture/issues/issue-7669.compiled.css
new file mode 100644
index 0000000000..3de5579d87
--- /dev/null
+++ b/crates/swc_css_modules/tests/fixture/issues/issue-7669.compiled.css
@@ -0,0 +1,15 @@
+.__local__class > .inner {
+  color: blue;
+}
+.__local__class[data-x=true] > .inner {
+  color: red;
+}
+.__local__class[data-x=true] > .__local__inner {
+  color: green;
+}
+.__local__class[data-x=true] > .inner {
+  color: yellow;
+}
+.__local__class[data-x=true] > .__local__inner {
+  color: black;
+}
diff --git a/crates/swc_css_modules/tests/fixture/issues/issue-7669.css b/crates/swc_css_modules/tests/fixture/issues/issue-7669.css
new file mode 100644
index 0000000000..e7abe9cc04
--- /dev/null
+++ b/crates/swc_css_modules/tests/fixture/issues/issue-7669.css
@@ -0,0 +1,16 @@
+.class:global > .inner {
+    color: blue;
+}
+.class:global[data-x=true] > .inner {
+    color: red;
+}
+.class:local[data-x=true] > .inner {
+    color: green;
+}
+.class[data-x=true]:global > .inner {
+    color: yellow;
+}
+.class[data-x=true]:local > .inner {
+    color: black;
+}
+
diff --git a/crates/swc_css_modules/tests/fixture/issues/issue-7669.transform.json b/crates/swc_css_modules/tests/fixture/issues/issue-7669.transform.json
new file mode 100644
index 0000000000..e6aed8684f
--- /dev/null
+++ b/crates/swc_css_modules/tests/fixture/issues/issue-7669.transform.json
@@ -0,0 +1,14 @@
+{
+  "class": [
+    {
+      "type": "local",
+      "name": "__local__class"
+    }
+  ],
+  "inner": [
+    {
+      "type": "local",
+      "name": "__local__inner"
+    }
+  ]
+}