Open LeaVerou opened 2 weeks ago
Then to match defined custom elements, you'd need :defined:not(:predefined)
? Verbose but explicit and likely uncommon, seems fine.
Unfortunately, customized built-ins still exist despite Webkit not supporting them, so they probably need to be accounted for here:
<input>
matches :defined
<input is="x-foo">
does not match :defined
Presumably then via this proposal:
<input>
matches :predefined
<input is="x-foo">
does not match :predefined
It is currently impossible to match custom elements generically.
:not(:defined)
matches custom elements that have not yet been defined, but since:defined
also matches built-ins, there is no way to target all custom elements.Admittedly the use cases for this are niche (it came up in a Twitter discussion with a framework author who said they use a different code path when the template contains custom elements), but also it’s a pretty simple addition, so why not.
We could introduce a
:predefined
pseudo-class to match native elements, authors can simply use:not(:predefined)
to match custom elements. Or we could introduce a pseudo-class to directly match custom elements, though I have no idea what to call it 🙃(Ideally we should eventually introduce more granular selectors to target element by tag prefix and/or suffix but this is a nice quick fix that can be implemented pretty easily, and is useful in its own right.)