@supports stats

[LeaVerou]

Which features are most commonly detected and with what values (if any)?

We may also want to measure CSS.supports(), its JS counterpart.

[LeaVerou]

Let's drop CSS.supports() and values for simplicity.

We traverse rules with type: "supports". For which properties are detected, we look into rule.supports, split by and, then for each test extract:

• whether it's negated (starts with not\s+)
• whether it's a selector test (presence of selector before the opening paren)
• if it's not a selector test, extract the property name ([\w-](?=[:)]) after the opening paren)

[LeaVerou]

In the end I had to simplify a bit and drop negation, as it turns out the grammar of @supports conditionals is more tricky to parse than it seems.

The code I just pushed will only measure criteria, and not the logic that combines them (or, not etc). Also, since many times what's really tested is the value (e.g. @supports (width: min(1px, 1em))), I'm measuring the entire query, not just the property name.