Open
Description
Is there an existing issue for this?
- I have searched the existing issues and my issue is unique
- My issue appears in the command-line and not only in the text editor
Description Overview
react/display-name will report an error Component definition is missing display name when the React global import is shadowed within a function scope.
The same error does not occur for shadowed memo or forwardRef though.
Example
import React, { memo, forwardRef } from 'react'
const MixedShadowed = function () {
const memo = (cb) => cb()
const { forwardRef } = { forwardRef: () => null }
const [React] = [{ memo, forwardRef }]
const Comp = memo(() => {
return <div>shadowed</div>
})
const ReactMemo = React.memo(() => null)
const ReactForward = React.forwardRef((props, ref) => {
return `${props} ${ref}`
})
const OtherComp = forwardRef((props, ref) => `${props} ${ref}`)
return [Comp, ReactMemo, ReactForward, OtherComp]
}Running eslint from the command line you'll see the error:
11:21 error Component definition is missing display name react/display-name
12:24 error Component definition is missing display name react/display-name
Expected Behavior
I know most people won't shadow React, memo or forwardRef, but I'd still expect the error to not be reported in this case.
eslint-plugin-react version
v7.37.5
eslint version
v9.26.0
node version
v22.15.0