Merged
Conversation
The animation shorthand parser was silently dropping var() function tokens because they did not match any of the time/timing/direction/ fill-mode/play-state/iteration classifiers. For example, animation: shimmer var(--animation-duration, 1.5s) infinite would lose the var() and emit only animationName + animationIterationCount. Recognize var() tokens and assign them positionally per CSS shorthand semantics: bind to the longhand hinted by the var()'s fallback when possible, otherwise fall back to the next free time slot (duration first, then delay). Co-authored-by: Kenneth Skovhus <skovhus@users.noreply.github.com>
Contributor
|
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 01989c71f5
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Per review: previously, var() tokens with no classifiable fallback
(e.g. `var(--anim-token)`) were coerced into a duration/delay slot.
This silently miscompiles cases like `${kf} var(--anim-token) 2s
infinite` where `--anim-token: ease-in` resolves at runtime — the
browser would treat `2s` as the duration.
Now bail and emit a warning when an animation shorthand contains a
var() whose runtime longhand position cannot be determined statically.
The shorthand is left intact (no transformation), preserving original
semantics. Users can rebind the variable to a specific longhand
(e.g. `animation-duration: var(--x)`) to opt in to transformation.
Co-authored-by: Kenneth Skovhus <skovhus@users.noreply.github.com>
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.
The animation shorthand parser silently dropped
var(...)tokens. Recognise them and bind to the longhand hinted by thevar()fallback (e.g.var(--x, 1.5s)→animationDuration). When the fallback type cannot be inferred (e.g.var(--anim-token)), bail and leave the shorthand intact rather than coerce it to a time slot — coercing would miscompile cases like${kf} var(--anim-token) 2s infinitewhere the variable resolves to a non-time value at runtime.