CSS features seem to be unsupported on headless Chromium
davidsneighbour opened this issue · 5 comments
I am pretty sure that this is the wrong place to open this issue and not a problem with your scripts, but somehow it might be helpful to see whatever solution this brings for others: I am using a specific CSS3-feature that seems to be broken in the screenshots.
Original (with Chrome browser loaded):
Could you maybe point me in a direction what exactly is the issue here?
Problems:
- dark theme is default, light theme is used (cache? I just changed today to the dark theme as default, but adding random characters to the URL won't load a dark theme screenshot)
- background-clip is not working - code
Is the headless Chrome somehow in-capacitated in regards to specific features? I thought the used browser in puppeteer is the latest version...
Can you provide the URL of the broken page?
Chromium Version is here: https://github.com/alixaxel/chrome-aws-lambda#versioning
The issue comes up too when I run an e2e testing tool over the site (Cypress.io) so my guess currently is, that the browser needs a flag enabled and they disable these styles for speed optimisation.
This was my own fault. I misread the info on caniuse.com as "it's working" when it's actually only working with -webkit prefix. I guess selection of the default theme too is based on a feature not enabled in Chrome. Closing this, sorry.
No worries at all! Appreciate you coming back to update!