From d1cf76c030e65240f47ca7939e93a8a21c524522 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B0=A6=E7=94=B7?= <haolongli.lhl@digital-engine.com>
Date: Wed, 8 May 2024 10:51:46 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AE=9E=E7=8E=B0PseudoElement?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 crates/mako/src/visitors/css_px2rem.rs | 69 ++++++++++++++++++++++----
 1 file changed, 58 insertions(+), 11 deletions(-)

diff --git a/crates/mako/src/visitors/css_px2rem.rs b/crates/mako/src/visitors/css_px2rem.rs
index 5d8a3ce5b..fa3ec1a88 100644
--- a/crates/mako/src/visitors/css_px2rem.rs
+++ b/crates/mako/src/visitors/css_px2rem.rs
@@ -171,8 +171,8 @@ fn parse_compound_selector(selector: &CompoundSelector) -> String {
             SubclassSelector::PseudoClass(pseudo) => {
                 result.push_str(format!(":{}", pseudo.name.value).as_str());
             }
-            _ => {
-                // TODO: support more subclass selectors
+            SubclassSelector::PseudoElement(pse_element) => {
+                result.push_str(format!("::{}", pse_element.name.value).as_str());
             }
         }
     }
@@ -454,26 +454,63 @@ mod tests {
     fn test_class_pseudo() {
         assert_eq!(
             run(
-                r#".jj:before,.jj:after{width:100px;}"#,
+                r#".jj:hover,.jj:focus{width:100px;}"#,
                 Px2RemConfig {
                     ..Default::default()
                 }
             ),
-            r#".jj:before,.jj:after{width:1rem}"#
+            r#".jj:hover,.jj:focus{width:1rem}"#
+        );
+    }
+    #[test]
+    fn test_element_pseudo() {
+        assert_eq!(
+            run(
+                r#".jj::before,.jj::after{width:100px;}"#,
+                Px2RemConfig {
+                    ..Default::default()
+                }
+            ),
+            r#".jj::before,.jj::after{width:1rem}"#
+        );
+    }
+    #[test]
+    fn test_element_pseudo_select_black() {
+        assert_eq!(
+            run(
+                r#".jj::before,.jj::after{width:100px;}"#,
+                Px2RemConfig {
+                    selector_blacklist: vec![".jj::after".to_string()],
+                    ..Default::default()
+                }
+            ),
+            r#".jj::before,.jj::after{width:100px}"#
+        );
+    }
+    #[test]
+    fn test_element_pseudo_select_white() {
+        assert_eq!(
+            run(
+                r#".jj::before,.jj::after{width:100px;}"#,
+                Px2RemConfig {
+                    selector_whitelist: vec![".jj::after".to_string()],
+                    ..Default::default()
+                }
+            ),
+            r#".jj::before,.jj::after{width:100px}"#
         );
     }
-
     #[test]
     fn test_class_pseudo_select_black() {
         assert_eq!(
             run(
-                r#".jj:before,.jj:after{width:100px;}"#,
+                r#".jj:hover,.jj:focus{width:100px;}"#,
                 Px2RemConfig {
-                    selector_blacklist: vec![".jj:after".to_string()],
+                    selector_blacklist: vec![".jj:focus".to_string()],
                     ..Default::default()
                 }
             ),
-            r#".jj:before,.jj:after{width:100px}"#
+            r#".jj:hover,.jj:focus{width:100px}"#
         );
     }
 
@@ -481,13 +518,23 @@ mod tests {
     fn test_class_pseudo_select_white() {
         assert_eq!(
             run(
-                r#".jj:before,.jj:after{width:100px;}"#,
+                r#".jj:hover,.jj:focus{width:100px;}"#,
+                Px2RemConfig {
+                    selector_whitelist: vec![".jj:focus".to_string(), ".jj:hover".to_string()],
+                    ..Default::default()
+                }
+            ),
+            r#".jj:hover,.jj:focus{width:1rem}"#
+        );
+        assert_eq!(
+            run(
+                r#".jj:hover,.jj:focus{width:100px;}"#,
                 Px2RemConfig {
-                    selector_whitelist: vec![".jj:after".to_string()],
+                    selector_whitelist: vec![".jj:hover".to_string()],
                     ..Default::default()
                 }
             ),
-            r#".jj:before,.jj:after{width:100px}"#
+            r#".jj:hover,.jj:focus{width:100px}"#
         );
     }