Skip to content

feat: add CSS custom property tracking to CSSSourceCode#377

Draft
wingding12 wants to merge 1 commit intoeslint:mainfrom
wingding12:feat/css-variable-tracking
Draft

feat: add CSS custom property tracking to CSSSourceCode#377
wingding12 wants to merge 1 commit intoeslint:mainfrom
wingding12:feat/css-variable-tracking

Conversation

@wingding12
Copy link

@wingding12 wingding12 commented Feb 11, 2026

Summary

Implements RFC eslint/rfcs#136 to centralize CSS custom property (variable) tracking on CSSSourceCode, making it available to all rules.

Changes

CSSSourceCode (src/languages/css-source-code.js):

  • Added #customProperties private map, populated during AST traversal, tracking declarations, @property definitions, and var() references for each custom property name
  • Added #declarationVariables WeakMap to track which var() functions appear in each declaration
  • Added getDeclarationVariables(declaration) to return var() function nodes used in a declaration value
  • Added getClosestVariableValue(funcOrName) to resolve the closest value for a var() function (same-block, fallback, previous rules, @Property initial-value), also accepts a string name for chain resolution
  • Added getVariableValues(func) to return all possible values for a var() function across the entire file (hoisting-aware)

no-invalid-properties rule (src/rules/no-invalid-properties.js):

  • Refactored to use sourceCode.getClosestVariableValue() and sourceCode.getVariableValues() instead of maintaining its own vars Map
  • Removed the incremental variable tracking that prevented hoisting
  • Variable resolution now sees all declarations in the file regardless of source position, which naturally fixes Bug: variable hoisting ignored in rule "css/no-invalid-properties" #199 (variable hoisting)

Tests

  • 21 new tests for CSSSourceCode covering getDeclarationVariables(), getClosestVariableValue(), and getVariableValues()
  • 2 new valid test cases for no-invalid-properties verifying variable hoisting works

Refs #160
Fixes #199

@linux-foundation-easycla
Copy link

linux-foundation-easycla bot commented Feb 11, 2026

CLA Signed

The committers listed above are authorized under a signed CLA.

  • ✅ login: wingding12 / name: William Ding (a8a01db)

Implements RFC eslint/rfcs#136 to centralize CSS variable tracking
on CSSSourceCode, making it available to all rules.

Adds:
- `#customProperties` map populated during AST traversal
- `getDeclarationVariables(declaration)` to get var() functions in a declaration
- `getClosestVariableValue(func)` to resolve closest value for a var() call
- `getVariableValues(func)` to get all possible values across the file

Refactors `no-invalid-properties` to use the new API instead of maintaining
its own variable tracking. This naturally fixes variable hoisting (eslint#199)
since the new API sees all declarations in the file regardless of source
position.

Refs eslint#160
Fixes eslint#199
@wingding12 wingding12 force-pushed the feat/css-variable-tracking branch from c9c73f2 to a8a01db Compare February 11, 2026 21:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

Status: Needs Triage

Development

Successfully merging this pull request may close these issues.

Bug: variable hoisting ignored in rule "css/no-invalid-properties"

1 participant