Repository navigation
Keep quoted CSS URLs whole when they contain a parenthesis (4.1.1) - #243
Merged
Merged
Conversation
The url() rewriter stopped at the first ")", so a quoted data URI such as Bootstrap's navbar toggler SVG, which contains "rgba(0, 0, 0, 0.5)", was cut short. When no file matched, it was written back without its opening quote, leaving a stray quote behind. With 4.1.0's compressed output on a single line, that stray quote opened a string that ran to the end of the file, and browsers dropped every rule after it (up to 89% of the rules in the sites' pages/*, links/* and analytics stylesheets). A quoted URL now ends at its matching closing quote, and a URL that doesn't match a file is left exactly as written. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Coverage Report for CI Build 40002061135Coverage remained the same at 100.0%Details
Uncovered ChangesNo uncovered changes found. Coverage RegressionsNo coverage regressions found. Coverage Stats
💛 - Coveralls |
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Why
4.1.0 breaks most of the CSS in about 7 stylesheets on every site, and 28 on admin.stores.com. These are the
pages/*,links/*and analytics stylesheets, plus everything that includes the SDK's Bootstrap.The cause is an old bug in electricity's
url(...)rewriting that 4.1.0 made visible:rgba(0, 0, 0, 0.5).), found no file at that "path", and wrote the URL back without its opening", leaving a stray"behind."as the start of a string, and a string runs until the next line break.Rules the browser kept, measured by loading the files in Chrome:
pages/index.csslinks/list.cssupload/index.cssThe one-rule difference left with the fix is an empty
.bootstrap { }block, which compressed output drops.This is what fails admin.stores.com's
/uploadaccessibility test onmain. Its.ext-chiprule comes after the toggler, so the labels rendered unstyled. The same commit with electricity 4.0.0 passes.What changed
lib/processor.js: a quoted URL now ends at its matching closing quote (url\((['"]?)(.*?)\1\)), and a URL that doesn't match a file is left exactly as written instead of losing its quotes..scssfixture with such a data URI and checks that the URL stays whole. It fails on 4.1.0 and passes with this fix.Sites depend on
~4.1.0, so they pick up 4.1.1 on their next CI run or deploy without any package bumps.Testing
npm test: 66 of 66 pass, andnpx eslint .is clean.url(...)on all 12 sites (126 files) with this fix and loaded each in Chrome in both compressed and readable form. All of them keep every rule except the empty.bootstrap { }block, and no unquoted URL containing a quote is left.🤖 Generated with Claude Code