Fix selector-pseudo-class-no-unknown false negatives for non-standard :slotted

[Mouvedia]

What steps are needed to reproduce the bug?

:slotted(.foo) {}

What Stylelint configuration is needed to reproduce the bug?

{
   "rules": {
     "selector-pseudo-class-no-unknown": true
   }
}

How did you run Stylelint?

https://stylelint.io/demo/

What did you expect to happen?

Unexpected unknown pseudo-class selector ":slotted"

What actually happened?

no error

Proposal to fix the bug

Distinguish between the pseudo-class—which is vue specific—and the standard pseudo-element.

ref:

• pseudo-class: https://vuejs.org/api/sfc-css-features.html#slotted-selectors
• pseudo-element: https://drafts.csswg.org/css-scoping/#slotted-pseudo

[ybiquitous]

@Mouvedia Thanks for the report. To confirm, do you mean the ::slotted() pseudo-element, not pseudo-class?

If so, we could see the selector-pseudo-element-no-unknown rule false negative with this demo.

::slotted(.foo) {}

{
  "rules": {
    "selector-pseudo-element-no-unknown": true
  }
}

[Mouvedia]

To confirm, do you mean the ::slotted() pseudo-element, not pseudo-class?

@ybiquitous Ill quote myself:

Distinguish between the pseudo-class—which is vue specific—and the standard pseudo-element.

ref:

• pseudo-class: vuejs.org/api/sfc-css-features.html#slotted-selectors
• pseudo-element: drafts.csswg.org/css-scoping/#slotted-pseudo

So no, I want an error for :slotted() when { "ignorePseudoClasses": [ "slotted"] } is missing for the rule selector-pseudo-class-no-unknown because it's not standard.
e.g. if you switch from vue to react the unknown pseudo-class wouldn't be detected

If so, we could see the selector-pseudo-element-no-unknown rule false negative with this demo.

::slotted() is not unknown.
i.e. in a non-vue project you want to detect that you are not using :slotted() but still allow ::slotted()

[ybiquitous]

@Mouvedia Thanks for the explanation, and sorry for my misunderstanding. 🙇🏼

I understand your motivation. You mean selector-pseudo-class-no-unknown should error for the non-standard :slotted pseudo-class. This bug is a false negative of selector-pseudo-class-no-unknown.

I've labeled the issue as ready to implement. Please consider contributing if you have time.

There are steps on how to fix a bug in a rule in the Developer guide.