linter: react-hooks/refs flags the documented lazy ref initialization idiom
What version of oxlint are you using?
1.81.0
What did you expect to see?
No diagnostic. Lazily initializing a ref and then reading it is the pattern React documents under Avoiding recreating the ref contents, and [email protected] — whose refs rule is preset: Recommended, severity: Error — permits it.
What did you see instead?
react(refs): Cannot access refs during render, on const owner = ownerRef.current;.
Reproduction
.oxlintrc.json:
{
"plugins": ["react"],
"categories": { "correctness": "off", "suspicious": "off", "pedantic": "off", "perf": "off", "style": "off", "restriction": "off", "nursery": "off" },
"rules": { "react-hooks/refs": "error" }
}
repro.ts:
import { useEffect, useRef } from 'react';
export const useOwner = (): symbol => {
const ownerRef = useRef<symbol | null>(null);
ownerRef.current ??= Symbol('owner');
const owner = ownerRef.current;
useEffect(() => {
console.log(owner);
}, [owner]);
return owner;
};
Then oxlint .
Comparison with eslint-plugin-react-hooks
Running [email protected] with [email protected] and only react-hooks/refs: error reports nothing here.
That plugin silently bails its compiler pass on some constructs, so a zero from it can be vacuous. I checked for that: appending a component containing a known violation to the same file is reported, which proves the analyser reaches this code and is deliberately permitting the idiom rather than skipping the file.
Source: oxc-project/oxc