You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Hi All,
When I update my projects to Angular 12, I found a really annoying bug that makes my compiled CSS had some syntax error. so I started to dig for this error and found that a lot of issues mentioned the same problem like angular/angular-cli#20975 and an opened one angular/angular-cli#20760 till I found that the problem in @angular-devkit/build-angular and it's dependant on GoogleChromeLabs/critters and I found an Issue opened GoogleChromeLabs/critters#74 but when I tracking the bug in the library it leads me to this project and found an open issue #154
so I found the problem in the Parser in [https://github.com/reworkcss/css/blob/434aa1733f275a67ea700311451b98a14f8cc21a/lib/parse/index.js#L516](this line), the regular expression not suitable for all scenarios especially the strings which had a semicolon inside the value like @import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700');
so I start to get a clone from this repo to fix this problem and I found this repo want really big attention because it follows a 9 years old code for example the test cases file had some bug in reading files so I fix it and add two new test cases for a start.
If this repo will be in a supply chain library for a big framework like Angular, the code must be maintained
Agree, the regexp needs some love. For example it would reject the last-in-file at-rule with omitted ending semicolon. It is correct syntax in css.
Regarding urls I'd suggest adding also a test for data URLs eg. background: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2236%22%20height%3D%2212%22%20viewBox%3D%220%200%2036%2012%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.33s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2230%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.66s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%3C%2Fsvg%3E%0A");
Hi, I'm not sure if this repo is still used for the last version of Angular but I created a fork of it and plan to maintain it at: https://github.com/adobe/css-tools
In a few days, the version will be published into npmjs.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
elawady55
changed the title
Hi All,
When I update my projects to Angular 12, I found a really annoying bug that makes my compiled CSS had some syntax error. so I started to dig for this error and found that a lot of issues mentioned the same problem like angular/angular-cli#20975 and an opened one angular/angular-cli#20760 till I found that the problem in
@angular-devkit/build-angularand it's dependant onGoogleChromeLabs/crittersand I found an Issue opened GoogleChromeLabs/critters#74 but when I tracking the bug in the library it leads me to this project and found an open issue #154so I found the problem in the Parser in [https://github.com/reworkcss/css/blob/434aa1733f275a67ea700311451b98a14f8cc21a/lib/parse/index.js#L516](this line), the regular expression not suitable for all scenarios especially the strings which had a semicolon inside the value like
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700');so I start to get a clone from this repo to fix this problem and I found this repo want really big attention because it follows a 9 years old code for example the test cases file had some bug in reading files so I fix it and add two new test cases for a start.
If this repo will be in a supply chain library for a big framework like Angular, the code must be maintained