feat(parser): add more help messages to diagnostics

crates/oxc_parser/src/diagnostics.rs

@@ -465,12 +465,16 @@ pub fn ts_constructor_this_parameter(span: Span) -> OxcDiagnostic {
 
 #[cold]
 pub fn ts_constructor_type_parameter(span: Span) -> OxcDiagnostic {
-    ts_error("1092", "Type parameters cannot appear on a constructor declaration").with_label(span)
+    ts_error("1092", "Type parameters cannot appear on a constructor declaration")
+        .with_label(span)
+        .with_help("Instead, add type parameters to the class itself")
 }
 
 #[cold]
 pub fn ts_arrow_function_this_parameter(span: Span) -> OxcDiagnostic {
-    ts_error("2730", "An arrow function cannot have a `this` parameter.").with_label(span)
+    ts_error("2730", "An arrow function cannot have a `this` parameter.")
+        .with_label(span)
+        .with_help("Arrow function does not bind `this` and inherits `this` from the outer scope")
 }
 
 #[cold]
@@ -486,7 +490,7 @@ pub fn ts_empty_type_argument_list(span: Span) -> OxcDiagnostic {
 #[cold]
 pub fn unexpected_super(span: Span) -> OxcDiagnostic {
     OxcDiagnostic::error("'super' can only be used with function calls or in property accesses")
-        .with_help("replace with `super()` or `super.prop` or `super[prop]`")
+        .with_help("Replace with `super()` or `super.prop` or `super[prop]`")
         .with_label(span)
 }
 
@@ -561,7 +565,10 @@ pub fn using_declaration_cannot_be_exported(identifier: &str, span: Span) -> Oxc
 #[cold]
 pub fn jsx_element_no_match(span: Span, span1: Span, name: &str) -> OxcDiagnostic {
     OxcDiagnostic::error(format!("Expected corresponding JSX closing tag for '{name}'."))
-        .with_labels([span, span1])
+        .with_labels([
+            span1.primary_label(format!("Expected `</{name}>`")),
+            span.label("Opened here"),
+        ])
 }
 
 #[cold]
@@ -707,6 +714,7 @@ pub fn readonly_in_array_or_tuple_type(span: Span) -> OxcDiagnostic {
 pub fn accessibility_modifier_on_private_property(modifier: &Modifier) -> OxcDiagnostic {
     ts_error("18010", "An accessibility modifier cannot be used with a private identifier.")
         .with_label(modifier.span)
+        .with_help("Private identifiers are enforced at runtime, while accessibility modifiers only affect type checking, so using both is redundant.")
 }
 
 #[cold]
@@ -754,7 +762,9 @@ pub fn unexpected_exponential(x0: &str, span1: Span) -> OxcDiagnostic {
 
 #[cold]
 pub fn import_equals_can_only_be_used_in_typescript_files(span: Span) -> OxcDiagnostic {
-    ts_error("8002", "'import ... =' can only be used in TypeScript files.").with_label(span)
+    ts_error("8002", "'import ... =' can only be used in TypeScript files.")
+        .with_label(span)
+        .with_help("TypeScript transforms 'import ... =' to 'const ... ='")
 }
 
 #[cold]

tasks/coverage/snapshots/parser_babel.snap

@@ -3130,7 +3130,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·     ─────
  4 │   }
    ╰────
-  help: replace with `super()` or `super.prop` or `super[prop]`
+  help: Replace with `super()` or `super.prop` or `super[prop]`
 
   × Cannot assign to 'arguments' in strict mode
    ╭─[babel/packages/babel-parser/test/fixtures/es2015/destructuring/binding-arguments-module/input.js:1:9]
@@ -4834,7 +4834,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
  1 │ super
    · ─────
    ╰────
-  help: replace with `super()` or `super.prop` or `super[prop]`
+  help: Replace with `super()` or `super.prop` or `super[prop]`
 
   × 'super' can only be referenced in members of derived classes or object literal expressions.
    ╭─[babel/packages/babel-parser/test/fixtures/es2015/uncategorised/344/input.js:1:1]
@@ -6452,7 +6452,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·                ─────
  4 │     }
    ╰────
-  help: replace with `super()` or `super.prop` or `super[prop]`
+  help: Replace with `super()` or `super.prop` or `super[prop]`
 
   × 'super' can only be used with function calls or in property accesses
    ╭─[babel/packages/babel-parser/test/fixtures/es2020/optional-chaining/optional-super-property-class/input.js:3:16]
@@ -6461,7 +6461,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·                ─────
  4 │     }
    ╰────
-  help: replace with `super()` or `super.prop` or `super[prop]`
+  help: Replace with `super()` or `super.prop` or `super[prop]`
 
   × Tagged template expressions are not permitted in an optional chain
    ╭─[babel/packages/babel-parser/test/fixtures/es2020/optional-chaining/optional-tagged-template-literals/input.js:1:5]
@@ -10299,7 +10299,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·          ─────
  4 │     }
    ╰────
-  help: replace with `super()` or `super.prop` or `super[prop]`
+  help: Replace with `super()` or `super.prop` or `super[prop]`
 
   × 'super' can only be used with function calls or in property accesses
    ╭─[babel/packages/babel-parser/test/fixtures/esprima/es2015-super-property/invalid_super_id/input.js:2:17]
@@ -10308,7 +10308,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·                 ─────
  3 │ }
    ╰────
-  help: replace with `super()` or `super.prop` or `super[prop]`
+  help: Replace with `super()` or `super.prop` or `super[prop]`
 
   × Super calls are not permitted outside constructors or in nested functions inside constructors.
    ╭─[babel/packages/babel-parser/test/fixtures/esprima/es2015-super-property/invalid_super_id/input.js:2:13]
@@ -12900,6 +12900,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·   ───────
  4 │ 
    ╰────
+  help: Private identifiers are enforced at runtime, while accessibility modifiers only affect type checking, so using both is redundant.
 
   × TS(1276): An 'accessor' property cannot be declared optional.
    ╭─[babel/packages/babel-parser/test/fixtures/typescript/class/accessor-invalid/input.ts:7:14]
@@ -12925,6 +12926,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·              ───
  3 │ }
    ╰────
+  help: Instead, add type parameters to the class itself
 
   × TS(1092): Type parameters cannot appear on a constructor declaration
    ╭─[babel/packages/babel-parser/test/fixtures/typescript/class/constructor-with-type-parameters-babel-7/input.ts:2:14]
@@ -12933,6 +12935,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·              ───
  3 │ }
    ╰────
+  help: Instead, add type parameters to the class itself
 
   × 'declare' modifier cannot be used here.
    ╭─[babel/packages/babel-parser/test/fixtures/typescript/class/declare-accessor/input.ts:2:3]
@@ -13359,6 +13362,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·   ───────
  3 │ }
    ╰────
+  help: Private identifiers are enforced at runtime, while accessibility modifiers only affect type checking, so using both is redundant.
 
   × TS(18010): An accessibility modifier cannot be used with a private identifier.
    ╭─[babel/packages/babel-parser/test/fixtures/typescript/class/private-fields-modifier-protected/input.ts:2:3]
@@ -13367,6 +13371,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·   ─────────
  3 │ }
    ╰────
+  help: Private identifiers are enforced at runtime, while accessibility modifiers only affect type checking, so using both is redundant.
 
   × TS(18010): An accessibility modifier cannot be used with a private identifier.
    ╭─[babel/packages/babel-parser/test/fixtures/typescript/class/private-fields-modifier-public/input.ts:2:3]
@@ -13375,6 +13380,7 @@ Expect to Parse: tasks/coverage/babel/packages/babel-parser/test/fixtures/typesc
    ·   ──────
  3 │ }
    ╰────
+  help: Private identifiers are enforced at runtime, while accessibility modifiers only affect type checking, so using both is redundant.
 
   × A property cannot be both optional and definite.
    ╭─[babel/packages/babel-parser/test/fixtures/typescript/class/property-optional-definite-assignment-not-allowed/input.ts:2:4]

tasks/coverage/snapshots/parser_misc.snap

@@ -3140,25 +3140,31 @@ Negative Passed: 107/107 (100.00%)
    ╰────
 
   × Expected corresponding JSX closing tag for 'Apple'.
-   ╭─[misc/fail/oxc-3528.jsx:1:10]
+   ╭─[misc/fail/oxc-3528.jsx:1:18]
  1 │ let a = <Apple></Banana>;
-   ·          ─────   ──────
+   ·          ──┬──   ───┬──
+   ·            │        ╰── Expected `</Apple>`
+   ·            ╰── Opened here
  2 │ 
    ╰────
 
   × Expected corresponding JSX closing tag for 'Apple:Orange'.
-   ╭─[misc/fail/oxc-3528.jsx:3:10]
+   ╭─[misc/fail/oxc-3528.jsx:3:25]
  2 │ 
  3 │ let b = <Apple:Orange></Banana>;
-   ·          ────────────   ──────
+   ·          ──────┬─────   ───┬──
+   ·                │           ╰── Expected `</Apple:Orange>`
+   ·                ╰── Opened here
  4 │ 
    ╰────
 
   × Expected corresponding JSX closing tag for 'Apple.Orange'.
-   ╭─[misc/fail/oxc-3528.jsx:5:10]
+   ╭─[misc/fail/oxc-3528.jsx:5:25]
  4 │ 
  5 │ let c = <Apple.Orange></Banana>;
-   ·          ────────────   ──────
+   ·          ──────┬─────   ───┬──
+   ·                │           ╰── Expected `</Apple.Orange>`
+   ·                ╰── Opened here
    ╰────
 
   × 'readonly' modifier cannot be used here.

tasks/coverage/snapshots/parser_test262.snap

@@ -24379,7 +24379,7 @@ Expect to Parse: tasks/coverage/test262/test/annexB/language/expressions/assignm
  15 │ super;
     · ─────
     ╰────
-  help: replace with `super()` or `super.prop` or `super[prop]`
+  help: Replace with `super()` or `super.prop` or `super[prop]`
 
   × 'super' can only be referenced in members of derived classes or object literal expressions.
     ╭─[test262/test/language/module-code/early-super.js:15:1]