Skip to content

[Compiler Bug]: set-state-in-effect false negative whenever tagged template literals are present #35029

@mdwyer6

Description

@mdwyer6

What kind of issue is this?

  • React Compiler core (the JS output is incorrect, or your app works incorrectly after optimization)
  • babel-plugin-react-compiler (build issue installing or using the Babel plugin)
  • eslint-plugin-react-compiler (build issue installing or using the eslint plugin)
  • react-compiler-healthcheck (build issue installing or using the healthcheck script)

Link to repro

https://stackblitz.com/edit/stackblitz-starters-9kernjp2?file=app%2Fpage.tsx

Repro steps

React Compiler appears to bail out of functions whenever a tagged template literal is present. I've tested this with the set-state-in-effect rule but I believe this causes false negatives for any ESLint rule which uses the compiler. Some rules like exhaustive-deps, that I assume do not use the compiler, are unaffected.

Steps to reproduce

  1. Write an invalid code snippet you expect to fail the set-state-in-effect rule
  2. Include a tagged template literal anywhere inside the same component as the invalid code
  3. Observe that the presence of the tagged template literal causes the error to be suppressed

I've included a small reproduction with both set-state-in-effect and exhaustive-deps violations. Running npm run lint shows only the exhaustive-deps failure unless you comment out the tagged template

This might already be on your radar as React Compiler not supporting tagged template literals seems to be a known issue and this error prevents lowering to HIR

How often does this bug happen?

Every time

What version of React are you using?

19

What version of React Compiler are you using?

1.0

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions