Open LeaVerou opened 4 years ago
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:
not\s+
)selector
before the opening paren)[\w-](?=[:)])
after the opening paren)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.
Which features are most commonly detected and with what values (if any)?
We may also want to measure
CSS.supports()
, its JS counterpart.