-
Notifications
You must be signed in to change notification settings - Fork 746
Description
I think one feature we should add to Conditional Rules Level 4 is a feature query function to test for selector support, presumably called selector()
.
I've started a draft of an explainer for this, from which I quote the relevant section:
Having feature queries based on selectors is probably the highest priority addition, both because it seems the most likely to be important in the near future, and because it is the simplest. It has come up recently because CSS authors using the features in the CSS Scrollbars Module Level 1 may want to query for support of those features, and may also want to query for support of the ::-webkit-scrollbar
pseudo-element.
I believe a possible syntax for such a feature was discussed at one point early in the development of @supports
, but I can't find meeting minutes of the discussion. I think the best way to extend the syntax is using a selector()
function, as in:
@supports (scrollbar-width: thin) or selector(::-webkit-scrollbar) {
#chatwindow { overflow: scroll; scrollbar-width: thin }
#chatwindow::-webkit-scrollbar { width: 5px }
}
It is worth noting that this usage requires that the selector()
feature query function not copy the quirks that are present in selector parsing, where all ::-webkit-*
pseudo-elements behave as though they're supported (and allow the selector to parse). Instead, inside of the selector()
feature query function, this quirk should not be present, and a selector()
function containing a ::-webkit-*
pseudo-element should only be true if the pseudo-element is actually supported.
Other than this, the function should work just as the tests for support/validity work in the rules on handling invalid selectors.