search

jsx-eslint / eslint-plugin-react

React-specific linting rules for ESLint
MIT License
8.88k stars 2.76k forks source link

[Bug]: jsx-curly-newline and comments #3584

Open josemigallas opened 1 year ago

josemigallas commented 1 year ago

Is there an existing issue for this?

Description Overview

jsx-curly-newline reports an error when using multiline comments in JSX.

      {/* <FormGroup
        helperTextInvalid={helperText}
        inputProps={inputProps}
        type="password"
      /> */}
  134:7   error  Unexpected newline after '{'                             react/jsx-curly-newline
  138:12  error  Unexpected newline before '}'                            react/jsx-curly-newline

$ eslint --ext .js,.jsx,.ts,.tsx .

Expected Behavior

I would expect no error.

Rule options

"react/jsx-curly-newline": ["error", { "multiline": "forbid", "singleline": "forbid" }],

eslint-plugin-react version

7.32.2

eslint version

7.32.0

node version

14.21.3

ljharb commented 1 year ago

if you removed the comment delimiters, what would happen?

ROSSROSALES commented 3 months ago

I am unable to recreate this error with your example. @josemigallas, were you able to resolve this issue?

ljharb commented 3 months ago

Closing, but will reopen if it can be reproduced.

josemigallas commented 3 months ago

Apologies, I lost track of this issue but I have not been able to fix it yet.

if you removed the comment delimiters, what would happen?

Like this?

      { <FormGroup
        helperTextInvalid={helperText}
        inputProps={inputProps}
        type="password"
      /> }

The error doesn't show up, but others do:

  57:7   error  Curly braces are unnecessary here                                             react/jsx-curly-brace-presence
  57:10  error  'FormGroup' is not defined                                                    react/jsx-no-undef
  58:28  error  Unsafe assignment of an `any` value                                           @typescript-eslint/no-unsafe-assignment
  59:21  error  Unsafe assignment of an `any` value                                           @typescript-eslint/no-unsafe-assignment
  61:7   error  The closing bracket must be aligned with the opening tag (expected column 9)  react/jsx-closing-bracket-location

It also doesn't show with one line comments like:

{/* <FormGroup ... */}
ROSSROSALES commented 3 months ago

@josemigallas thanks for responding! Just to make sure, is it possible to see your jsx-curly-newline rule options?

josemigallas commented 3 months ago

@josemigallas thanks for responding! Just to make sure, is it possible to see your jsx-curly-newline rule options?

"react/jsx-curly-newline": ["error", { "multiline": "forbid", "singleline": "forbid" }],

I also added it to the issue's description.