I want to use the puppeteer devtools protocol to do the following, given an element (i.e., its nodeId), I would like to know what media queries did not apply to the current element, but could have (e.g if it was larger/smaller/etc.)
Asked
Active
Viewed 22 times
1
Foobar
- 7,458
- 16
- 81
- 161
-
The easiest way to do this would probably be by executing some JS to read the [CSSRuleList](https://developer.mozilla.org/en-US/docs/Web/API/CSSRuleList). Then check if the rule is a media query, then check if the selectors within the media query match your element. Things might get complicated to accurately reflect the cascading nature of CSS. – Mattwmaster58 Jul 07 '23 at 12:30