[Compiler Bug]: React Compiler throws hard errors for valid JS inside callbacks (non-render paths) #35570
Description
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-hooks (build issue installing or using the eslint plugin)
- react-compiler-healthcheck (build issue installing or using the healthcheck script)
Link to repro
Repro steps
I was implementing a normal login flow in a client component using the React Compiler.
The issue occurred inside an event handler callback (handleSubmit) that runs in response to a form submit.
Inside this callback, I wrapped an async authentication call in a try/catch block and performed basic result checking using optional chaining (e.g. if (result?.error)), which is valid JavaScript and works correctly at runtime.
As soon as this code was analyzed by the React Compiler, it threw a hard compilation error saying that value blocks (optional chaining, conditionals, etc.) are not supported inside try/catch. This happens even though the code is not render logic, not memoized, and not part of React’s reactive graph.
I wasn’t doing anything unusual or advanced — just standard error handling inside an async callback. Removing the optional chaining or restructuring the logic avoids the error, but that requires large mechanical refactors across the codebase.
The issue reproduces consistently whenever optional chaining (or similar expressions) is used inside a try/catch within a callback function.
How often does this bug happen?
Every time
What version of React are you using?
latest
What version of React Compiler are you using?
latest