Skip to main content
GoodFirstPicks
DashboardIssuesReposLeaderboard

GoodFirstPicks by Leaveitblank © 2026

CreatorRequest a RepoPrivacy PolicyTerms of Service
[Compiler Bug]: useEffectEvent bypasses react-hooks/set-state-in-effect lint rule | GoodFirstPicks

[Compiler Bug]: useEffectEvent bypasses react-hooks/set-state-in-effect lint rule

facebook/react 1 comments 1mo ago
View on GitHub
mediumopenScope: somewhat clearSkill match: maybeReactJavaScriptTypeScript

Why this is a good first issue

The issue involves a lint rule bypass that needs to be addressed in the eslint-plugin-react-hooks.

AI Summary

The issue describes a scenario where `useEffectEvent` bypasses the `react-hooks/set-state-in-effect` lint rule, allowing developers to circumvent intended restrictions. The fix would likely involve updating the lint rule to account for `useEffectEvent`. The main challenge is ensuring the fix doesn't introduce new issues or false positives.

Issue 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

https://playground.react.dev/#N4Igzg9grgTgxgUxALhASwLYAcIwC4AEwBUYCAogGaUJx4A0JZVNd5AbggHYNMIDKeAIZ4EBAL4FKMCBgIByGAiF15AbgA6XLQgAeOfATgQuYQgGFZOLt0IBeAgAoAlATsA+IloJGTZggDajGR4giIIALpufGGijvLyzpraXD6kFNS0eI4ubp7A3j4EAPTFBBhCMADWCAAmBEJgBEoqeAC0ABYQEFVgxSFtZuFtaFxtCJl0BAgwMjCFPiGxCPGiZonJPuKMARFJWoXGpoQm-AihwqLR6SxZHLY5rh5eqUVLlyvya3gbheL7KTSzEm2VyzwKrx8pQIABtRoQsI0yGAFgRTudli5NhIAYUlHhYKkuFAYTDkuJkiB6CAjpQ0ABzFDobC4Qh4ACeWDExAACjCoPTRgB5LB4NB+CRSGRyeQAIyEsoQMLaWH5grGLTobWM2DQMJmxVqaHWyS0jghUOKOqwepE4q4AFkILUEMgCBoQEJSR6tJIwHawHSEE0+QLhaL7WAklTwF0AO4ASR4My4XrAKEoaYQ4iAA

Repro steps

Calling setState in useEffect is marked as an error per react-hooks/set-state-in-effect lint:

  const [, setState] = useState('');

  useEffect(() => {
    // marked as react-hooks/set-state-in-effect error
    setState('test');
  }, []);

However there is no lint error if the setState is wrapped in an useEffectEvent:

  const onSetState = useEffectEvent(() => {
    setState('test');
  });

  useEffect(() => {
    // lint passes
    onSetState();
  });

This provides an easy escape hatch for developers who want to bypass the lint rule.

How often does this bug happen?

Every time

What version of React are you using?

19.2

What version of React Compiler are you using?

No compiler needed. eslint-plugin-react-hooks is 7.0.1

GitHub Labels

Type: BugStatus: Unconfirmed

Want to work on this?

Claim this issue to let others know you're working on it. You'll earn 10 points when you complete it!

Risk Flags

  • lint rule bypass
  • potential misuse of useEffectEvent
Loading labels...

Details

Points10 pts
Difficultymedium
Scopesomewhat clear
Skill Matchmaybe
Test Focusedno