styled-components/vscode-styled-components

Highlighting breaks when using attrs with props value

Open

#292 opened on May 19, 2021

View on GitHub
 (25 comments) (37 reactions) (0 assignees)JavaScript (893 stars) (123 forks)batch import
E-Hardbughelp wantedhighlighting-grammar

Description

**Describe the bug ** I gonna apply attris by pass props. But highlight is broken.

Screenshot

image

Expected behavior HightLight has to be keep

  • OS: [Windows10]
  • VSCode Version: [1.56.0]
  • Extension Version [1.6.1]

Additional context Add any other context about the problem here.

Contributor guide

Tech stack
typescriptcss
Domain
toolingdeveloper experiencefrontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
Understanding of TextMate grammarsBasic knowledge of styled componentsVSCode extension development
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
40
Research direction
The bug occurs when applying attrs via props. Investigate the TextMate grammar file (likely at syntaxes/styled components.json) to see how attrs and props are tokenized. Look for recent changes or issues related to attrs and highlighting. Consider adding a test case for attrs with props to ensure highlighting is preserved.