Skip to content

[Bug]: jsx-curly-brace-presence incorrectly removes {""} used for whitespace preservation #3995

@kirk-b-hansen

Description

@kirk-b-hansen

Is there an existing issue for this?

  • I have searched the existing issues and my issue is unique
  • My issue appears in the command-line and not only in the text editor

Description Overview

In some scenarios where {""} is used for whitespace preservation, jsx-curly-brace-presence incorrectly flags the braces as unnecessary, and --fix introduces a visual regression.

export default function App() {
  return (
    <span>
      <span>The braces</span>
      {""} matter here.
    </span>
  );
}

Applying "react/jsx-curly-brace-presence": ["error", { "children": "never" }] to this block causes

  5:7  error  Curly braces are unnecessary here  react/jsx-curly-brace-presence

This is incorrect, since the {""} preserves the whitespace between "braces" and "matter". Additionally, eslint --fix leads to

export default function App() {
  return (
    <span>
      <span>The braces</span>
       matter here.
    </span>
  );
}

which is a visual regression: "The braces matter here." becomes "The bracesmatter here.".

Expected Behavior

jsx-curly-brace-presence should not flag curly braces that are serving a purpose, and eslint --fix should never introduce behavior regressions.

eslint-plugin-react version

v7.37.5

eslint version

v9.39.4

node version

v25.8.0

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions