# grammars: Highlight class instantiations in JavaScript, TypeScript, and TSX \(\#61890\) · gitcafe/zed

[View on GitCafe](https://git.cafe/gitcafe/zed/commit/b6b2148bd0e23f4dc3bfe17468ad1a6fbd89b748)

Repository: [gitcafe/zed](https://git.cafe/gitcafe/zed)

Visibility: public

Requested revision: b6b2148bd0e23f4dc3bfe17468ad1a6fbd89b748

Requested commit: b6b2148bd0e23f4dc3bfe17468ad1a6fbd89b748

Commit: b6b2148bd0e23f4dc3bfe17468ad1a6fbd89b748

Tree: a1d2879f0c29b3bced90815cbb70287ac0abab37

Author: Ibrahim Khan

Committer: GitHub

## Message

```
grammars: Highlight class instantiations in JavaScript, TypeScript, and TSX (#61890)

## Why

JavaScript, TypeScript, and TSX class declarations were captured as
`type.class`, but the same class names in `new` expressions were
captured as the generic `type`. Themes that define a distinct style for
`type.class` therefore rendered declarations and instantiations
inconsistently.

## What

Update the three highlight queries so constructor identifiers in `new`
expressions use `type.class`. Themes without a dedicated `type.class`
style continue to fall back to their existing `type` style.

Add a regression test that loads the real JavaScript, TypeScript, and
TSX grammars with distinct colors for `type` and `type.class`, then
verifies that both the declaration and instantiation receive the
class-specific highlight.

## Testing

- `cargo test -p languages test_class_instantiation_highlighting`
- `cargo test -p languages`
- `cargo fmt --all -- --check`
- `./script/clippy -p languages`

## References

Closes #55943

Release Notes:

- Fixed inconsistent class instantiation highlighting in JavaScript,
TypeScript, and TSX.
```

## Parents

- [9a631e5461194bbdbbd5b4a8d1b9236a211494ee](https://git.cafe/gitcafe/zed/commit/9a631e5461194bbdbbd5b4a8d1b9236a211494ee?format=markdown)

[Source at this commit](https://git.cafe/gitcafe/zed/tree/b6b2148bd0e23f4dc3bfe17468ad1a6fbd89b748?format=markdown)