Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Replace our CSS parsers with an external parser #127

Open
kdzwinel opened this issue Jul 12, 2018 · 1 comment
Open

Replace our CSS parsers with an external parser #127

kdzwinel opened this issue Jul 12, 2018 · 1 comment

Comments

@kdzwinel
Copy link
Collaborator

kdzwinel commented Jul 12, 2018

Background: We are doing a bit too much work than we should by writing our own parsers for css property values (e.g. gradient, shadow, background).

Task: Research css parsers (e.g. https://github.com/reworkcss/css ), and replace our parsers.

🤔does any CSS parser parses property values?
🤔can we use the native CSSOM instead?

@tlenex
Copy link
Contributor

tlenex commented Oct 1, 2020

https://github.com/niklasvh/html2canvas/tree/master/src/css can be helpfull if we stick to parsing things internally

To use CSSOM you'd need to use some kind of headless-browser working as child-process, since nodejs does not support CSSOM API natively.
Additionally CSSOM is not a value parser. EDIT: Well I've found out it is: https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleValue/parse

For parsing values I'd recommend using PostCSS with this plugin:
https://github.com/shellscape/postcss-values-parser
Main postcss.parse() runner can parse whole stylesheets too.
It runs as nodejs process so it can be tricky to get web stylesheets into it from rendered document, but hey... it's nodejs, we can set up a temp http server to receive that data.
https://postcss.org/api/#postcss-parse
https://github.com/postcss/postcss#syntaxes

I hope this helps @kdzwinel

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants