feat: Improve error message of input:placeholder

selectors/parser.rs

@@ -197,7 +197,8 @@ pub enum SelectorParseErrorKind<'i> {
   MissingNestingPrefix,
   UnexpectedTokenInAttributeSelector(Token<'i>),
   PseudoElementExpectedIdent(Token<'i>),
-  UnsupportedPseudoClassOrElement(CowRcStr<'i>),
+  UnsupportedPseudoElement(CowRcStr<'i>),
+  UnsupportedPseudoClass(CowRcStr<'i>),
   AmbiguousCssModuleClass(CowRcStr<'i>),
   UnexpectedIdent(CowRcStr<'i>),
   ExpectedNamespace(CowRcStr<'i>),
@@ -312,31 +313,31 @@ pub trait Parser<'i> {
     location: SourceLocation,
     name: CowRcStr<'i>,
   ) -> Result<<Self::Impl as SelectorImpl<'i>>::NonTSPseudoClass, ParseError<'i, Self::Error>> {
-    Err(location.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name)))
+    Err(location.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClass(name)))
   }
 
   fn parse_non_ts_functional_pseudo_class<'t>(
     &self,
     name: CowRcStr<'i>,
     arguments: &mut CssParser<'i, 't>,
   ) -> Result<<Self::Impl as SelectorImpl<'i>>::NonTSPseudoClass, ParseError<'i, Self::Error>> {
-    Err(arguments.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name)))
+    Err(arguments.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClass(name)))
   }
 
   fn parse_pseudo_element(
     &self,
     location: SourceLocation,
     name: CowRcStr<'i>,
   ) -> Result<<Self::Impl as SelectorImpl<'i>>::PseudoElement, ParseError<'i, Self::Error>> {
-    Err(location.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name)))
+    Err(location.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoElement(name)))
   }
 
   fn parse_functional_pseudo_element<'t>(
     &self,
     name: CowRcStr<'i>,
     arguments: &mut CssParser<'i, 't>,
   ) -> Result<<Self::Impl as SelectorImpl<'i>>::PseudoElement, ParseError<'i, Self::Error>> {
-    Err(arguments.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name)))
+    Err(arguments.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoElement(name)))
   }
 
   fn default_namespace(&self) -> Option<<Self::Impl as SelectorImpl<'i>>::NamespaceUrl> {
@@ -3353,7 +3354,7 @@ pub mod tests {
           "active" => return Ok(PseudoClass::Active),
           _ => {}
       }
-      Err(location.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name)))
+      Err(location.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClass(name)))
     }
 
     fn parse_non_ts_functional_pseudo_class<'t>(
@@ -3368,7 +3369,7 @@ pub mod tests {
           },
           _ => {}
       }
-      Err(parser.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name)))
+      Err(parser.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClass(name)))
     }
 
     fn parse_pseudo_element(
@@ -3381,7 +3382,7 @@ pub mod tests {
           "after" => return Ok(PseudoElement::After),
           _ => {}
       }
-      Err(location.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name)))
+      Err(location.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoElement(name)))
     }
 
     fn default_namespace(&self) -> Option<DummyAtom> {

src/error.rs

@@ -230,8 +230,12 @@ pub enum SelectorError<'i> {
   UnexpectedTokenInAttributeSelector(
     #[cfg_attr(any(feature = "serde", feature = "nodejs"), serde(skip))] Token<'i>,
   ),
-  /// An unsupported pseudo class or pseudo element was encountered.
-  UnsupportedPseudoClassOrElement(CowArcStr<'i>),
+
+  /// An unsupported pseudo class was encountered.
+  UnsupportedPseudoClass(CowArcStr<'i>),
+
+  /// An unsupported pseudo element was encountered.
+  UnsupportedPseudoElement(CowArcStr<'i>),
 
   /// Ambiguous CSS module class.
   AmbiguousCssModuleClass(CowArcStr<'i>),
@@ -264,7 +268,8 @@ impl<'i> fmt::Display for SelectorError<'i> {
       PseudoElementExpectedIdent(token) => write!(f, "Invalid token in pseudo element: {:?}", token),
       UnexpectedIdent(name) => write!(f, "Unexpected identifier: {}", name),
       UnexpectedTokenInAttributeSelector(token) => write!(f, "Unexpected token in attribute selector: {:?}", token),
-      UnsupportedPseudoClassOrElement(name) => write!(f, "Unsupported pseudo class or element: {}", name),
+      UnsupportedPseudoClass(name) =>write!(f, "'{name}' is not recognized as a valid pseudo-class. Did you mean '::{name}' (pseudo-element) or is this a typo?"),
+      UnsupportedPseudoElement(name) => write!(f, "'{name}' is not recognized as a valid pseudo-element. Did you mean ':{name}' (pseudo-class) or is this a typo?"),
       AmbiguousCssModuleClass(_) => write!(f, "Ambiguous CSS module class not supported"),
       UnexpectedSelectorAfterPseudoElement(token) => {
         write!(
@@ -300,9 +305,8 @@ impl<'i> From<SelectorParseErrorKind<'i>> for SelectorError<'i> {
         SelectorError::UnexpectedTokenInAttributeSelector(t.into())
       }
       SelectorParseErrorKind::PseudoElementExpectedIdent(t) => SelectorError::PseudoElementExpectedIdent(t.into()),
-      SelectorParseErrorKind::UnsupportedPseudoClassOrElement(t) => {
-        SelectorError::UnsupportedPseudoClassOrElement(t.into())
-      }
+      SelectorParseErrorKind::UnsupportedPseudoClass(t) => SelectorError::UnsupportedPseudoClass(t.into()),
+      SelectorParseErrorKind::UnsupportedPseudoElement(t) => SelectorError::UnsupportedPseudoElement(t.into()),
       SelectorParseErrorKind::UnexpectedIdent(t) => SelectorError::UnexpectedIdent(t.into()),
       SelectorParseErrorKind::ExpectedNamespace(t) => SelectorError::ExpectedNamespace(t.into()),
       SelectorParseErrorKind::ExpectedBarInAttr(t) => SelectorError::ExpectedBarInAttr(t.into()),

src/lib.rs

@@ -27186,6 +27186,14 @@ mod tests {
           color: red;
         }
       }
+
+      input:placeholder {
+        color: red;
+      }
+
+      input::hover {
+        color: red;
+      }
     "#,
       indoc! { r#"
       .foo {
@@ -27201,6 +27209,14 @@ mod tests {
           color: red;
         }
       }
+
+      input:placeholder {
+        color: red;
+      }
+
+      input::hover {
+        color: red;
+      }
     "#},
       ParserOptions {
         filename: "test.css".into(),
@@ -27238,6 +27254,22 @@ mod tests {
             column: 9
           })
         },
+        Error {
+          kind: ParserError::SelectorError(SelectorError::UnsupportedPseudoClass("placeholder".into())),
+          loc: Some(ErrorLocation {
+            filename: "test.css".into(),
+            line: 24,
+            column: 13,
+          }),
+        },
+        Error {
+          kind: ParserError::SelectorError(SelectorError::UnsupportedPseudoElement("hover".into())),
+          loc: Some(ErrorLocation {
+            filename: "test.css".into(),
+            line: 28,
+            column: 13,
+          }),
+        },
       ]
     )
   }

src/properties/animation.rs

@@ -406,7 +406,11 @@ pub enum TimelineRangeName {
 /// or [animation-range-end](https://drafts.csswg.org/scroll-animations/#animation-range-end) property.
 #[derive(Debug, Clone, PartialEq)]
 #[cfg_attr(feature = "visitor", derive(Visit))]
-#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize), serde(rename_all = "lowercase"))]
+#[cfg_attr(
+  feature = "serde",
+  derive(serde::Serialize, serde::Deserialize),
+  serde(rename_all = "lowercase")
+)]
 #[cfg_attr(feature = "jsonschema", derive(schemars::JsonSchema))]
 #[cfg_attr(feature = "into_owned", derive(static_self::IntoOwned))]
 pub enum AnimationAttachmentRange {

src/selector.rs

@@ -196,7 +196,7 @@ impl<'a, 'o, 'i> parcel_selectors::parser::Parser<'i> for SelectorParser<'a, 'o,
 
       _ => {
         if !name.starts_with('-') {
-          self.options.warn(loc.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name.clone())));
+          self.options.warn(loc.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClass(name.clone())));
         }
         Custom { name: name.into() }
       }
@@ -225,7 +225,7 @@ impl<'a, 'o, 'i> parcel_selectors::parser::Parser<'i> for SelectorParser<'a, 'o,
       "global" if self.options.css_modules.is_some() => Global { selector: Box::new(Selector::parse(self, parser)?) },
       _ => {
         if !name.starts_with('-') {
-          self.options.warn(parser.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name.clone())));
+          self.options.warn(parser.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClass(name.clone())));
         }
         let mut args = Vec::new();
         TokenList::parse_raw(parser, &mut args, &self.options, 0)?;
@@ -285,7 +285,7 @@ impl<'a, 'o, 'i> parcel_selectors::parser::Parser<'i> for SelectorParser<'a, 'o,
 
       _ => {
         if !name.starts_with('-') {
-          self.options.warn(loc.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name.clone())));
+          self.options.warn(loc.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoElement(name.clone())));
         }
         Custom { name: name.into() }
       }
@@ -309,7 +309,7 @@ impl<'a, 'o, 'i> parcel_selectors::parser::Parser<'i> for SelectorParser<'a, 'o,
       "view-transition-new" => ViewTransitionNew { part_name: ViewTransitionPartName::parse(arguments)? },
       _ => {
         if !name.starts_with('-') {
-          self.options.warn(arguments.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoClassOrElement(name.clone())));
+          self.options.warn(arguments.new_custom_error(SelectorParseErrorKind::UnsupportedPseudoElement(name.clone())));
         }
         let mut args = Vec::new();
         TokenList::parse_raw(arguments, &mut args, &self.options, 0)?;