Reports entire CSS twice for inlined CSS in <head>
bartveneman opened this issue · 5 comments
CSS is inlined in <head> with a <style> tag. Extract-css-core reports the whole thing twice, but with different formatting for colors: first time it's#3d515b (as authored), second time it's rgb(61, 81, 91) (see Project Wallace commit). https://projectwallace.com/get-css also sees 1 <link>‐tag or @import and 1 <style> ‐tag or CSS‐in‐JS.
The <style> ‐tag or CSS‐in‐JS seems off, because it shows colors in RGB format and also shows the CSS un-minified. The type is more correct in this case though, because the CSS is from within a <style> tag.
I encountered this issue as well. In my case the css was extracted from minified html at a url.
The url
https://motuhenga.com
The report
https://www.projectwallace.com/~motuhenga/motuhengacom
I've tried reproducing this issue locally, but it didn't work. Perhaps it's an issue in https://github.com/bartveneman/extract-css. Going to have a look there.
After updating all dependencies, the result for https://extract-css-git-upgrade-deps-bartveneman.vercel.app/api/extract-css?url=https://www.veneman.dev is still a duplication of CSS.
That limits the number of possible causes. I think chrome-aws-lambda is the problem here or some serverless issue that I know nothing about.
Found the root cause: using the coverage API + document.stylesheets caused the duplication. This is fixed now, but we've lost minication of the CSS: if you had any minified CSS on your site, the Stylesheets API unminifies it, so we need to tackle that.