Mapping generated CSS classes to JavaScript files
- Dominant language
- JavaScript
- Stars
- 284
- Forks
- 17
- PR merge metrics
- No merged PRs in 30d
Description
With traditional stylesheets, in Chrome I can select an element, look at its styles, and see where they came from (i.e., which file). It'd be great if there were a similar process for RCSS (i.e., a way to figure out which JavaScript file generated a certain RCSS class). I can think of two ways of doing this:
1. The generated CSS class name somehow encapsulates the JavaScript file from which it was generated. For example, if it was generated in tooltip.jsx, then the classname might be `c0-tooltip`.
2. The generated tag somehow encapsulates the JavaScript file from which it was generated. I'm really not sure if there's a useful way to do this, but it might be attractive if there's some attribute we can add and have the Chrome devtools pick up without additional work.
Contributor guide
No contributing guide indexed for this repository
Research direction
Start by tracing how RCSS generates class names and inserts style tags, then compare the two proposed approaches: encoding the JavaScript source in class names or adding source metadata to style tags. Done means a generated RCSS class can be traced to the JavaScript file that produced it through Chrome inspection.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100