-
Notifications
You must be signed in to change notification settings - Fork 49.1k
Open
Labels
Status: UnconfirmedA potential issue that we haven't yet confirmed as a bugA potential issue that we haven't yet confirmed as a bugType: Bug
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-compiler (build issue installing or using the eslint plugin)
- react-compiler-healthcheck (build issue installing or using the healthcheck script)
Link to repro
Repro steps
Run eslint-plugin-react-hooks with the react-compiler rule turned on
See
Error: Cannot call impure function during render
`Math.random` is an impure function. Calling an impure function can produce unstable results that update unpredictably when the component happens to re-render.
Math.random() is not called during render, and is only called during a useCallback that is called outside of the component’s render cycle:
import { useRef, useEffect, useCallback } from 'react';
export default function MyApp() {
const requestRef = useRef<number | null>(null);
const animate = useCallback((time: number) => {
// ⚠️ false positive “impure function called during render” here:
console.log(Math.random() + time);
requestRef.current = requestAnimationFrame(animate);
}, []);
// Start the render loop
useEffect(() => {
requestRef.current = requestAnimationFrame(animate);
return () => { if (requestRef.current) cancelAnimationFrame(requestRef.current); };
}, [animate]);
return null;
}
How often does this bug happen?
Every time
What version of React are you using?
react@19.1.1
What version of React Compiler are you using?
eslint-plugin-react-hooks@0.0.0-experimental-9be531cd-20250729
Metadata
Metadata
Assignees
Labels
Status: UnconfirmedA potential issue that we haven't yet confirmed as a bugA potential issue that we haven't yet confirmed as a bugType: Bug