From 269e1c3fd5963eb91f4e9671ed29ee51ce17fcd4 Mon Sep 17 00:00:00 2001
From: feeiyu <158308373+feeiyu@users.noreply.github.com>
Date: Mon, 13 Jul 2026 06:29:35 +0800
Subject: [PATCH] Improve JS/TS/TSX parameter highlighting for destructuring
 (#60767)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

# Objective

Fixes #51967

Destructured JS/TS/TSX parameters with defaults were not highlighted
consistently as parameters when using themes that distinguish arguments
from variables/properties, such as Catppuccin.

For example, in:

```js
function a({ argument = true }) {}
```

`argument` was parsed under a default assignment pattern and did not
receive the same `@variable.parameter` capture as a destructured
parameter without a default.

This also affected array binding patterns with defaults, such as:

```js
function b([argument = true]) {}
```

## Solution

Updated the JS/TS/TSX highlight queries to capture destructured
parameters with default values as `@variable.parameter`.

This covers both:

- Object binding patterns with defaults, such as `{ argument = true }`
- Array binding patterns with defaults, such as `[argument = true]`

As a result, destructured parameters are highlighted consistently
whether or not they provide a default value.

## Testing

- Verified the highlight query changes for JavaScript/TypeScript
destructured parameters with defaults.
- Tested examples include:
    ```js
    function a({ argument }) {}
    function a({ argument = true }) {}
    function a({ argument = true }?) {} //optional
    function b([argument]) {}
    function b([argument = true]) {}
    function b([argument = true]?) {} // optional
    ```
- These cases should be easiest to visually confirm with a theme that
distinguishes parameters from variables/properties, such as Catppuccin.

## Self-Review Checklist:

- [X] I've reviewed my own diff for quality, security, and reliability
- [X] Unsafe blocks (if any) have justifying comments
- [X] The content adheres to Zed's UI standards
([UX/UI](https://github.com/zed-industries/zed/blob/main/CONTRIBUTING.md#uiux-checklist)
and
[icon](https://github.com/zed-industries/zed/blob/main/crates/icons/README.md)
guidelines)
- [ ] Tests cover the new/changed behavior
- [X] Performance impact has been considered and is acceptable

## Showcase

Before this change,
<img width="1600" height="332" alt="图片"
src="https://github.com/user-attachments/assets/fbacb22b-f0e4-490d-8f94-6059e66d3ae0"
/>

After this change:
<img width="1599" height="353" alt="图片"
src="https://github.com/user-attachments/assets/3eae692b-391e-4c53-9925-1ca2f5774038"
/>


Release Notes:

- Fixed inconsistent syntax highlighting for JS/TS/TSX destructured
parameters with default values.
---
 crates/grammars/src/javascript/highlights.scm | 20 +++++++++++++++++++
 crates/grammars/src/tsx/highlights.scm        | 20 +++++++++++++++++++
 crates/grammars/src/typescript/highlights.scm | 20 +++++++++++++++++++
 3 files changed, 60 insertions(+)

diff --git a/crates/grammars/src/javascript/highlights.scm b/crates/grammars/src/javascript/highlights.scm
index 8525649098..336fcdd36a 100644
--- a/crates/grammars/src/javascript/highlights.scm
+++ b/crates/grammars/src/javascript/highlights.scm
@@ -98,6 +98,26 @@
       (shorthand_property_identifier_pattern)
     ]) @variable.parameter))
 
+(required_parameter
+  (_
+    (object_assignment_pattern
+      left: (shorthand_property_identifier_pattern) @variable.parameter)))
+
+(required_parameter
+  (_
+    (assignment_pattern
+      left: (identifier) @variable.parameter)))
+
+(optional_parameter
+  (_
+    (object_assignment_pattern
+      left: (shorthand_property_identifier_pattern) @variable.parameter)))
+
+(optional_parameter
+  (_
+    (assignment_pattern
+      left: (identifier) @variable.parameter)))
+
 (optional_parameter
   (identifier) @variable.parameter)
 
diff --git a/crates/grammars/src/tsx/highlights.scm b/crates/grammars/src/tsx/highlights.scm
index e8cb7a1106..3dd9038782 100644
--- a/crates/grammars/src/tsx/highlights.scm
+++ b/crates/grammars/src/tsx/highlights.scm
@@ -98,6 +98,26 @@
       (shorthand_property_identifier_pattern)
     ]) @variable.parameter))
 
+(required_parameter
+  (_
+    (object_assignment_pattern
+      left: (shorthand_property_identifier_pattern) @variable.parameter)))
+
+(required_parameter
+  (_
+    (assignment_pattern
+      left: (identifier) @variable.parameter)))
+
+(optional_parameter
+  (_
+    (object_assignment_pattern
+      left: (shorthand_property_identifier_pattern) @variable.parameter)))
+
+(optional_parameter
+  (_
+    (assignment_pattern
+      left: (identifier) @variable.parameter)))
+
 (optional_parameter
   (identifier) @variable.parameter)
 
diff --git a/crates/grammars/src/typescript/highlights.scm b/crates/grammars/src/typescript/highlights.scm
index 0213adb10f..c3ecf17946 100644
--- a/crates/grammars/src/typescript/highlights.scm
+++ b/crates/grammars/src/typescript/highlights.scm
@@ -193,6 +193,26 @@
       (shorthand_property_identifier_pattern)
     ]) @variable.parameter))
 
+(required_parameter
+  (_
+    (object_assignment_pattern
+      left: (shorthand_property_identifier_pattern) @variable.parameter)))
+
+(required_parameter
+  (_
+    (assignment_pattern
+      left: (identifier) @variable.parameter)))
+
+(optional_parameter
+  (_
+    (object_assignment_pattern
+      left: (shorthand_property_identifier_pattern) @variable.parameter)))
+
+(optional_parameter
+  (_
+    (assignment_pattern
+      left: (identifier) @variable.parameter)))
+
 (optional_parameter
   (identifier) @variable.parameter)