fix(lint): only highlight function names in useMaxParams rule (#7608)

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: ritoban23

.changeset/ten-donkeys-raise.md

@@ -0,0 +1,5 @@
+---
+"@biomejs/biome": patch
+---
+
+Fixed [#7604](https://github.com/biomejs/biome/issues/7604): the `useMaxParams` rule now highlights parameter lists instead of entire function bodies. This provides more precise error highlighting. Previously, the entire function was highlighted; now only the parameter list is highlighted, such as `(a, b, c, d, e, f, g, h)`.

crates/biome_js_analyze/src/lint/nursery/use_max_params.rs

@@ -8,7 +8,7 @@ use biome_js_syntax::{
     JsConstructorParameters, JsFunctionDeclaration, JsFunctionExpression, JsMethodClassMember,
     JsMethodObjectMember, JsParameters, TsDeclareFunctionDeclaration, TsTypeAliasDeclaration,
 };
-use biome_rowan::{AstNode, declare_node_union};
+use biome_rowan::{AstNode, TextRange, declare_node_union};
 use biome_rule_options::use_max_params::UseMaxParamsOptions;
 
 declare_lint_rule! {
@@ -84,6 +84,44 @@ declare_node_union! {
     pub AnyFunctionLike = JsFunctionDeclaration | JsFunctionExpression | JsArrowFunctionExpression | JsMethodClassMember | JsMethodObjectMember | JsConstructorClassMember | TsDeclareFunctionDeclaration | TsTypeAliasDeclaration
 }
 
+impl AnyFunctionLike {
+    pub fn parameter_range(&self) -> Option<TextRange> {
+        match self {
+            Self::JsFunctionDeclaration(func) => {
+                func.parameters().ok().map(|params| params.range())
+            }
+            Self::JsFunctionExpression(func) => func.parameters().ok().map(|params| params.range()),
+            Self::JsArrowFunctionExpression(func) => {
+                func.parameters().ok().map(|params| params.range())
+            }
+            Self::JsMethodClassMember(method) => {
+                method.parameters().ok().map(|params| params.range())
+            }
+            Self::JsMethodObjectMember(method) => {
+                method.parameters().ok().map(|params| params.range())
+            }
+            Self::JsConstructorClassMember(constructor) => {
+                constructor.parameters().ok().map(|params| params.range())
+            }
+            Self::TsDeclareFunctionDeclaration(decl) => {
+                decl.parameters().ok().map(|params| params.range())
+            }
+            Self::TsTypeAliasDeclaration(decl) => {
+                if let Ok(ty) = decl.ty() {
+                    match ty {
+                        biome_js_syntax::AnyTsType::TsFunctionType(func_type) => {
+                            func_type.parameters().ok().map(|params| params.range())
+                        }
+                        _ => None,
+                    }
+                } else {
+                    None
+                }
+            }
+        }
+    }
+}
+
 #[derive(Debug, Clone)]
 pub struct UseMaxParamsState {
     pub parameter_count: usize,
@@ -156,10 +194,13 @@ impl Rule for UseMaxParams {
         let node = ctx.query();
         let options = ctx.options();
 
+        // Use the parameter list range if available, otherwise fall back to the whole node
+        let range = node.parameter_range().unwrap_or_else(|| node.range());
+
         Some(
             RuleDiagnostic::new(
                 rule_category!(),
-                node.range(),
+                range,
                 markup! {
                     "Function has "{state.parameter_count}" parameters, but only "{options.max}" are allowed."
                 },

crates/biome_js_analyze/tests/specs/nursery/useMaxParams/invalid.js.snap

@@ -50,17 +50,14 @@ function withThisParam(this, a, b, c, d, e, f, g) {
 
 # Diagnostics
 ```
-invalid.js:1:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:1:23 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 8 parameters, but only 4 are allowed.
   
   > 1 │ function tooManyParams(a, b, c, d, e, f, g, h) {
-      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 2 │     return a + b + c + d + e + f + g + h;
-  > 3 │ }
-      │ ^
-    4 │ 
-    5 │ function namedFunction(a, b, c, d, e, f, g, h, i) {
+      │                       ^^^^^^^^^^^^^^^^^^^^^^^^
+    2 │     return a + b + c + d + e + f + g + h;
+    3 │ }
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -70,19 +67,16 @@ invalid.js:1:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━
 ```
 
 ```
-invalid.js:5:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:5:23 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 9 parameters, but only 4 are allowed.
   
     3 │ }
     4 │ 
   > 5 │ function namedFunction(a, b, c, d, e, f, g, h, i) {
-      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 6 │     return a + b + c + d + e + f + g + h + i;
-  > 7 │ }
-      │ ^
-    8 │ 
-    9 │ const fn1 = function(a, b, c, d, e, f, g, h) {
+      │                       ^^^^^^^^^^^^^^^^^^^^^^^^^^^
+    6 │     return a + b + c + d + e + f + g + h + i;
+    7 │ }
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -92,19 +86,16 @@ invalid.js:5:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━
 ```
 
 ```
-invalid.js:9:13 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:9:21 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 8 parameters, but only 4 are allowed.
   
      7 │ }
      8 │ 
    > 9 │ const fn1 = function(a, b, c, d, e, f, g, h) {
-       │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 10 │     return a + b + c + d + e + f + g + h;
-  > 11 │ };
-       │ ^
-    12 │ 
-    13 │ const fn2 = function namedFnExpression(a, b, c, d, e, f, g, h, i) {
+       │                     ^^^^^^^^^^^^^^^^^^^^^^^^
+    10 │     return a + b + c + d + e + f + g + h;
+    11 │ };
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -114,19 +105,16 @@ invalid.js:9:13 lint/nursery/useMaxParams ━━━━━━━━━━━━
 ```
 
 ```
-invalid.js:13:13 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:13:39 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 9 parameters, but only 4 are allowed.
   
     11 │ };
     12 │ 
   > 13 │ const fn2 = function namedFnExpression(a, b, c, d, e, f, g, h, i) {
-       │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 14 │     return a + b + c + d + e + f + g + h + i;
-  > 15 │ };
-       │ ^
-    16 │ 
-    17 │ const arrow1 = (a, b, c, d, e, f, g, h) => {
+       │                                       ^^^^^^^^^^^^^^^^^^^^^^^^^^^
+    14 │     return a + b + c + d + e + f + g + h + i;
+    15 │ };
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -143,12 +131,9 @@ invalid.js:17:16 lint/nursery/useMaxParams ━━━━━━━━━━━━
     15 │ };
     16 │ 
   > 17 │ const arrow1 = (a, b, c, d, e, f, g, h) => {
-       │                ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 18 │     return a + b + c + d + e + f + g + h;
-  > 19 │ };
-       │ ^
-    20 │ 
-    21 │ const arrow2 = (a, b, c, d, e, f, g, h, i) => a + b + c + d + e + f + g + h + i;
+       │                ^^^^^^^^^^^^^^^^^^^^^^^^
+    18 │     return a + b + c + d + e + f + g + h;
+    19 │ };
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -165,7 +150,7 @@ invalid.js:21:16 lint/nursery/useMaxParams ━━━━━━━━━━━━
     19 │ };
     20 │ 
   > 21 │ const arrow2 = (a, b, c, d, e, f, g, h, i) => a + b + c + d + e + f + g + h + i;
-       │                ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+       │                ^^^^^^^^^^^^^^^^^^^^^^^^^^^
     22 │ 
     23 │ class MyClass {
   
@@ -177,18 +162,15 @@ invalid.js:21:16 lint/nursery/useMaxParams ━━━━━━━━━━━━
 ```
 
 ```
-invalid.js:24:5 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:24:11 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 8 parameters, but only 4 are allowed.
   
     23 │ class MyClass {
   > 24 │     method(a, b, c, d, e, f, g, h) {
-       │     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 25 │         return a + b + c + d + e + f + g + h;
-  > 26 │     }
-       │     ^
-    27 │ 
-    28 │     constructor(a, b, c, d, e, f, g, h, i) {
+       │           ^^^^^^^^^^^^^^^^^^^^^^^^
+    25 │         return a + b + c + d + e + f + g + h;
+    26 │     }
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -198,19 +180,16 @@ invalid.js:24:5 lint/nursery/useMaxParams ━━━━━━━━━━━━
 ```
 
 ```
-invalid.js:28:5 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:28:16 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 9 parameters, but only 4 are allowed.
   
     26 │     }
     27 │ 
   > 28 │     constructor(a, b, c, d, e, f, g, h, i) {
-       │     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 29 │         this.sum = a + b + c + d + e + f + g + h + i;
-  > 30 │     }
-       │     ^
-    31 │ }
-    32 │ 
+       │                ^^^^^^^^^^^^^^^^^^^^^^^^^^^
+    29 │         this.sum = a + b + c + d + e + f + g + h + i;
+    30 │     }
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -220,18 +199,15 @@ invalid.js:28:5 lint/nursery/useMaxParams ━━━━━━━━━━━━
 ```
 
 ```
-invalid.js:34:5 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:34:11 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 8 parameters, but only 4 are allowed.
   
     33 │ const obj = {
   > 34 │     method(a, b, c, d, e, f, g, h) {
-       │     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 35 │         return a + b + c + d + e + f + g + h;
-  > 36 │     }
-       │     ^
-    37 │ };
-    38 │ 
+       │           ^^^^^^^^^^^^^^^^^^^^^^^^
+    35 │         return a + b + c + d + e + f + g + h;
+    36 │     }
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -241,18 +217,16 @@ invalid.js:34:5 lint/nursery/useMaxParams ━━━━━━━━━━━━
 ```
 
 ```
-invalid.js:39:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:39:23 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 8 parameters, but only 4 are allowed.
   
     37 │ };
     38 │ 
   > 39 │ function withThisParam(this, a, b, c, d, e, f, g) {
-       │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 40 │     return a + b + c + d + e + f + g;
-  > 41 │ }
-       │ ^
-    42 │ 
+       │                       ^^^^^^^^^^^^^^^^^^^^^^^^^^^
+    40 │     return a + b + c + d + e + f + g;
+    41 │ }
   
   i Functions with many parameters are hard to read and maintain.
   

crates/biome_js_analyze/tests/specs/nursery/useMaxParams/invalid.ts.snap

@@ -24,19 +24,16 @@ type sum = (a: number, b: number, c: number, d: number, e: number) => number;
 
 # Diagnostics
 ```
-invalid.ts:5:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.ts:5:23 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 6 parameters, but only 4 are allowed.
   
     3 │ }
     4 │ 
   > 5 │ function withThisParam(this: MyInterface, a: number, b: number, c: number, d: number, e: number): number {
-      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 6 │     return this.value + a + b + c + d + e;
-  > 7 │ }
-      │ ^
-    8 │ 
-    9 │ function tooManyParamsWithThis(this: MyInterface, a: number, b: number, c: number, d: number, e: number, f: number): number {
+      │                       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+    6 │     return this.value + a + b + c + d + e;
+    7 │ }
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -46,19 +43,16 @@ invalid.ts:5:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━
 ```
 
 ```
-invalid.ts:9:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.ts:9:31 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 7 parameters, but only 4 are allowed.
   
      7 │ }
      8 │ 
    > 9 │ function tooManyParamsWithThis(this: MyInterface, a: number, b: number, c: number, d: number, e: number, f: number): number {
-       │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 10 │     return this.value + a + b + c + d + e + f;
-  > 11 │ }
-       │ ^
-    12 │ 
-    13 │ declare function makeDate(m: number, d: number, y: number, h: number, min: number, s: number): Date;
+       │                               ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+    10 │     return this.value + a + b + c + d + e + f;
+    11 │ }
   
   i Functions with many parameters are hard to read and maintain.
   
@@ -68,14 +62,14 @@ invalid.ts:9:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━
 ```
 
 ```
-invalid.ts:13:9 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.ts:13:26 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 6 parameters, but only 4 are allowed.
   
     11 │ }
     12 │ 
   > 13 │ declare function makeDate(m: number, d: number, y: number, h: number, min: number, s: number): Date;
-       │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+       │                          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
     14 │ 
     15 │ type sum = (a: number, b: number, c: number, d: number, e: number) => number;
   
@@ -87,14 +81,14 @@ invalid.ts:13:9 lint/nursery/useMaxParams ━━━━━━━━━━━━
 ```
 
 ```
-invalid.ts:15:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.ts:15:12 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 5 parameters, but only 4 are allowed.
   
     13 │ declare function makeDate(m: number, d: number, y: number, h: number, min: number, s: number): Date;
     14 │ 
   > 15 │ type sum = (a: number, b: number, c: number, d: number, e: number) => number;
-       │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+       │            ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
     16 │ 
   
   i Functions with many parameters are hard to read and maintain.

crates/biome_js_analyze/tests/specs/nursery/useMaxParams/invalidCustomMax.js.snap

@@ -12,16 +12,15 @@ function twoParams(a, b) {
 
 # Diagnostics
 ```
-invalidCustomMax.js:2:1 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalidCustomMax.js:2:19 lint/nursery/useMaxParams ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Function has 2 parameters, but only 1 are allowed.
   
     1 │ // should generate diagnostics - function exceeds max of 1
   > 2 │ function twoParams(a, b) {
-      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^
-  > 3 │     return a + b;
-  > 4 │ }
-      │ ^
+      │                   ^^^^^^
+    3 │     return a + b;
+    4 │ }
   
   i Functions with many parameters are hard to read and maintain.