Wrong critical if <link media="only screen and (max-width: 768px)" href="..." rel="stylesheet">

[pasquiandrea]

Hi,

i found a problem if site contain stylesheet with media query declared on tag.

I have this two in a site:

<link media="all" href="/general.css" rel="stylesheet">
<link media="only screen and (max-width: 768px)" href="/mobile.css" rel="stylesheet">

I found in the source code of library that collecting all CSS is maid by intercepting network request on puppeteer.
The problem is that chrome, even if unused, download all CSS declared (ignoring media attribute of tag) and only then decides not to use it.
This behavior cause the library to take into account the CSS that is not really needed for my specific viewport (1400px width).
In my case the style contained in the second (mobile specific rules) with the media attribute is for mobile device ad the critical CSS generated for desktop is corrupted by mobile directives.

Unfortunately the site in question belongs to a third party and cannot be modified.

Thanks for the support