Custom state pseudo class

The feature enables custom elements to expose their states via :state() CSS pseudo class.

Built-in elements have certain “states” that can change over time depending on user interaction and other factors, and are exposed to web authors through pseudo classes. For example, some form controls have the “invalid” state, which is exposed through the :invalid pseudo class. Like built-in elements, custom elements may also have states, and web authors want to expose these states in a similar fashion as the built-in elements.

Documentation

Status in Chromium

Blink>HTML>CustomElements


Behind a flag (tracking bug) in:

  • Chrome for desktop release 79
  • Chrome for Android release 79
  • Android WebView release 79

Consensus & Standardization

After a feature ships in Chrome, the values listed here are not guaranteed to be up to date.

  • No public signals
  • No public signals
  • No public signals
  • Positive

Owners

Last updated on 2019-10-11