fix: parse @{var} interpolation in at-rule prelude (#180) - #181
Open
dshovchko wants to merge 1 commit into
Open
Conversation
PostCSS's `Parser#atrule` only tracks `(` and `[` in its brackets stack, so
the `{` of an interpolation such as `@media @{mq-xs}` was treated as the
start of the at-rule block, cutting the prelude short and throwing
`Unknown word`.
Merge `@{...}` token sequences in the prelude into single word tokens
before delegating to `super.atrule()`, mirroring the workaround `rule()`
already applies to selectors.
Author
|
Heads up on the red It's pre-existing and unrelated to this PR - Locally on this branch: |
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
1 participant
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.
Which issue # Fixes #180
Please check one:
This PR:
@media @{mq-xs} { … }throwsCssSyntaxError: Unknown word.PostCSS's
Parser#atruleonly tracks(and[in itsbracketsstack, so on the interpolation's{it takesbrackets.length === 0→open = true; break. The prelude is cut short andmq-xsends up parsed as an unknown word inside the block.LessParser#atrulecallsinterpolation()only on the at-rule's first token, which returnsfalsefor@media(length > 1), so interpolations in the prelude were never merged.LessParser#rulealready works around the same problem for selectors — this adds the missing at-rule counterpart:@{…}token sequences in the prelude are merged into single word tokens before delegating tosuper.atrule().This matters now because Less >= 4.7 deprecates the bare
@media @varform and points users at exactly the syntax that could not be parsed, so codebases migrating off the deprecation become un-lintable by stylelint.Tests
6 new parser cases in
test/parser/interpolation.test.js(basic@media @{mq-xs}, no space before{, followed by a media feature, multiple interpolations, interpolation inside a feature value, plus a regression guard for the bare@media @mq-xs) and a stringify round-trip intest/stringify.test.js.Full suite: 155 passing, lint clean.
Verification
Checked manually for regressions on
@import,@plugin, variable declarations, mixin calls, detached rulesets,@supports,@mediawith variables inside features, and@@varindirection — all still parse and round-trip. Also ran the patched parser over a real codebase (~900.lessfiles, ~1800 occurrences of the syntax): everything parses and round-trips cleanly.