eslint / eslint/css

Change Request: Track variables on SourceCode

Open
#160 16 comments 1 reaction 2 assignees Claimed by @nzakas View on GitHub
accepted enhancement
Dominant language
JavaScript
Stars
308
Forks
44
Avg merge
2d 6h
Merged PRs (30d)
18

Description

### Environment

HEAD

### What problem do you want to solve?

CSS variables are a significant part of modern CSS, and in order to accurately validate property values, each rule now has to track custom properties and see where they're applied in values.

### What do you think is the correct solution?

Something similar to the functionality of `eslint-scope` for CSS. I'm not quite sure on the details as the custom property/`var()` usage is a different paradigm than variables in JS, but something along the lines of a `sourceCode.customProperties` map where the key is the custom property name and the value is an object that tracks both rules where the custom property is set and declarations where the custom property value is read. We may also want to make it easy to get the closest value for that custom property to aid in validation, similar to what I did in https://github.com/eslint/css/pull/148.

### Participation

- [x] I am willing to submit a pull request for this change.

### Additional comments

We'd need an RFC for this to ensure we're thinking through the complexities.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.