Skip to content

Improve TS/TSX/JS syntax highlighting for parameters, types, and punctuation#43437

Merged
MrSubidubi merged 2 commits intozed-industries:mainfrom
claytercek:ts-syntax
Dec 8, 2025
Merged

Improve TS/TSX/JS syntax highlighting for parameters, types, and punctuation#43437
MrSubidubi merged 2 commits intozed-industries:mainfrom
claytercek:ts-syntax

Conversation

@claytercek
Copy link
Contributor

@claytercek claytercek commented Nov 24, 2025

This pull request enhances syntax highlighting for JavaScript, TypeScript, TSX, and JSDoc by adding more precise rules for parameters, types, and punctuation.

  • Added queries for highlighting parameters (@variable.parameter)
  • Expanded highlighting for type identifiers, type aliases, interfaces, classes
  • Extended/implemented types to improve distinction between different type constructs (@type, @type.class)
  • Added highlighting for punctuation in type parameters, unions, intersections, annotations, index signatures, optional fields, and predicates (@punctuation.special, @punctuation.bracket)
  • Added highlighting for identifiers in JSDoc comments (@variable.jsdoc)

Release Notes:

  • N/A

- Adds @variable.parameter, previously supported by other languages but not js/ts/tsx
- Removes queries that would mark any identifier starting with an uppercase letter as @type
- Adds additional @type queries
- Adds @type.class queries (copying @type.class capture from the python highlights)
- Adds '<'/'>' @punctuation.bracket query for type parameters
- Adds queries for type punctuation, applying @punctuation.special capture
Highlights param names and typenames
@cla-bot cla-bot bot added the cla-signed The user has signed the Contributor License Agreement label Nov 24, 2025
@MrSubidubi
Copy link
Member

Thanks for this! Could you perhaps add a before/after for these changes?

@claytercek
Copy link
Contributor Author

@MrSubidubi Yeah for sure! Here's a before/after in 3 different themes

Before After
github theme before github theme after
catpuccin theme before catpuccin theme before
ayu dark theme before ayu dark theme after

Copy link
Member

@MrSubidubi MrSubidubi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for this! I see the slight behavior change/regression in highlighting of class names, but I think these are reasonable and the highlighting before was too broad. So this looks good.

Thank you!

@MrSubidubi MrSubidubi merged commit 9364d39 into zed-industries:main Dec 8, 2025
24 checks passed
gaauwe added a commit that referenced this pull request Dec 9, 2025
…and punctuation" (#44490)

Reverts #43437

Internally we noticed some regression related to removed query for
PascalCase identifiers. Reverting now to prevent this from going to
preview, still planning to land this with the necessary fixes later.
@gaauwe
Copy link
Contributor

gaauwe commented Dec 9, 2025

@claytercek Heads up that we reverted this for now, since we noticed some regressions in the syntax highlighting. We still definitely want to land this with the necessary improvements, but need a bit more time with preview going out tomorrow.

gaauwe pushed a commit that referenced this pull request Dec 10, 2025
…tuation (#43437)

This pull request enhances syntax highlighting for JavaScript,
TypeScript, TSX, and JSDoc by adding more precise rules for parameters,
types, and punctuation.

- Added queries for highlighting parameters (`@variable.parameter`)
- Expanded highlighting for type identifiers, type aliases, interfaces,
classes
- Extended/implemented types to improve distinction between different
type constructs (`@type`, `@type.class`)
- Added highlighting for punctuation in type parameters, unions,
intersections, annotations, index signatures, optional fields, and
predicates (`@punctuation.special`, `@punctuation.bracket`)
- Added highlighting for identifiers in JSDoc comments
(`@variable.jsdoc`)

Release Notes:

- Refined syntax highlighting in JavaScript and TypeScript for better
visual distinction of
  types, parameters, and JSDoc elements
@claytercek claytercek deleted the ts-syntax branch December 10, 2025 14:24
gaauwe added a commit that referenced this pull request Dec 11, 2025
…tuation (#44532)

Relands #43437

Release Notes:

- Refined syntax highlighting in JavaScript and TypeScript for better
visual distinction of types, parameters, and JSDoc elements

---------

Co-authored-by: MrSubidubi <dev@bahn.sh>
Co-authored-by: Clay Tercek <30105080+claytercek@users.noreply.github.com>
@franciskafyi franciskafyi moved this from Community PRs to Done in Quality Week – December 2025 Dec 11, 2025
nrbnlulu pushed a commit to nrbnlulu/zed that referenced this pull request Dec 14, 2025
…tuation (zed-industries#44532)

Relands zed-industries#43437

Release Notes:

- Refined syntax highlighting in JavaScript and TypeScript for better
visual distinction of types, parameters, and JSDoc elements

---------

Co-authored-by: MrSubidubi <dev@bahn.sh>
Co-authored-by: Clay Tercek <30105080+claytercek@users.noreply.github.com>
CherryWorm pushed a commit to CherryWorm/zed that referenced this pull request Dec 16, 2025
…tuation (zed-industries#43437)

This pull request enhances syntax highlighting for JavaScript,
TypeScript, TSX, and JSDoc by adding more precise rules for parameters,
types, and punctuation.

- Added queries for highlighting parameters (`@variable.parameter`)
- Expanded highlighting for type identifiers, type aliases, interfaces,
classes
- Extended/implemented types to improve distinction between different
type constructs (`@type`, `@type.class`)
- Added highlighting for punctuation in type parameters, unions,
intersections, annotations, index signatures, optional fields, and
predicates (`@punctuation.special`, `@punctuation.bracket`)
- Added highlighting for identifiers in JSDoc comments
(`@variable.jsdoc`)

Release Notes:

- Refined syntax highlighting in JavaScript and TypeScript for better
visual distinction of
  types, parameters, and JSDoc elements
CherryWorm pushed a commit to CherryWorm/zed that referenced this pull request Dec 16, 2025
…and punctuation" (zed-industries#44490)

Reverts zed-industries#43437

Internally we noticed some regression related to removed query for
PascalCase identifiers. Reverting now to prevent this from going to
preview, still planning to land this with the necessary fixes later.
CherryWorm pushed a commit to CherryWorm/zed that referenced this pull request Dec 16, 2025
…tuation (zed-industries#44532)

Relands zed-industries#43437

Release Notes:

- Refined syntax highlighting in JavaScript and TypeScript for better
visual distinction of types, parameters, and JSDoc elements

---------

Co-authored-by: MrSubidubi <dev@bahn.sh>
Co-authored-by: Clay Tercek <30105080+claytercek@users.noreply.github.com>
someone13574 pushed a commit to someone13574/zed that referenced this pull request Dec 16, 2025
…tuation (zed-industries#43437)

This pull request enhances syntax highlighting for JavaScript,
TypeScript, TSX, and JSDoc by adding more precise rules for parameters,
types, and punctuation.

- Added queries for highlighting parameters (`@variable.parameter`)
- Expanded highlighting for type identifiers, type aliases, interfaces,
classes
- Extended/implemented types to improve distinction between different
type constructs (`@type`, `@type.class`)
- Added highlighting for punctuation in type parameters, unions,
intersections, annotations, index signatures, optional fields, and
predicates (`@punctuation.special`, `@punctuation.bracket`)
- Added highlighting for identifiers in JSDoc comments
(`@variable.jsdoc`)

Release Notes:

- Refined syntax highlighting in JavaScript and TypeScript for better
visual distinction of
  types, parameters, and JSDoc elements
someone13574 pushed a commit to someone13574/zed that referenced this pull request Dec 16, 2025
…and punctuation" (zed-industries#44490)

Reverts zed-industries#43437

Internally we noticed some regression related to removed query for
PascalCase identifiers. Reverting now to prevent this from going to
preview, still planning to land this with the necessary fixes later.
someone13574 pushed a commit to someone13574/zed that referenced this pull request Dec 16, 2025
…tuation (zed-industries#44532)

Relands zed-industries#43437

Release Notes:

- Refined syntax highlighting in JavaScript and TypeScript for better
visual distinction of types, parameters, and JSDoc elements

---------

Co-authored-by: MrSubidubi <dev@bahn.sh>
Co-authored-by: Clay Tercek <30105080+claytercek@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

cla-signed The user has signed the Contributor License Agreement

Projects

Development

Successfully merging this pull request may close these issues.

3 participants