Fix SCSSParsingError on unicode characters in SCSS selectors#14071
Merged
Fix SCSSParsingError on unicode characters in SCSS selectors#14071
Conversation
Collaborator
✅ Snyk checks have passed. No issues have been found so far.
💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse. |
Collaborator
|
It's not clear to me that these selectors are actually valid, but it's good to be more permissive here. |
Collaborator
Author
|
Yeah I wasn't sure but my search and lead to believe they were, even if this seems really edge case. |
scss-parser@1.0.6 tokenizer uses ASCII-only regex for identifiers, rejecting valid non-ASCII CSS characters (e.g., #présentation). Encode non-ASCII characters as ASCII codepoint placeholders before parsing since the parser is only used for variable analysis, not CSS generation. Fixes #14065 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
The SCSS analyzer encodes non-ASCII characters as _u<hex>_ for parsing, but cssVarsBlock emitted these encoded names into the CSS vars block. Dart Sass then failed because the encoded names don't match the original SCSS variable names. Decode before emitting so names round-trip correctly. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Assert that the CSS vars export block contains the decoded property name (--quarto-scss-export-présentation-bg), not just that the SCSS compiled successfully. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
The wildcard regex pr.*sentation matched both decoded and encoded forms, making the test pass regardless of whether decodeScssName worked. Use the literal character présentation-bg instead. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
794460c to
1dc70f8
Compare
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.
When custom SCSS contains non-ASCII characters in selectors (e.g.,
#présentation), rendering emits aSCSSParsingError: Can't handle characterwarning and CSS variable exports are lost.Root Cause
scss-parser@1.0.6's tokenizer uses an ASCII-only regex (
/[a-z_]/i) for identifier characters, rejecting valid non-ASCII CSS identifier characters like accented letters.Fix
Encode non-ASCII characters as ASCII codepoint placeholders (e.g.,
é→_ue9_) before passing SCSS to the parser. The parser is only used for variable analysis (color extraction for CSS custom property export), not CSS generation — dart-sass compiles the original unmodified SCSS. This follows the existing pattern of 6 other scss-parser workarounds inparse.ts.Fixes #14065