diff --git a/CHANGELOG.md b/CHANGELOG.md index 6d8fa1fb56..b163b4c080 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,11 +10,13 @@ This change log adheres to standards from [Keep a CHANGELOG](http://keepachangel * [`no-unused-class-component-methods`]: add `getChildContext` lifecycle method ([#3136][] @yoyo837) * [`prop-types`]: fix false positives on renames in object destructuring ([#3142][] @golopot) * [`no-arrow-function-lifecycle`]: fix invalid autofix from a concise arrow method to a regular one ([#3145][] @ljharb) +* [`display-name`]: avoid false positives on non-creatClass object expressions ([#3144] @ljharb) ### Changed * [readme] fix syntax typo ([#3141][] @moselhy) [#3145]: https://github.com/yannickcr/eslint-plugin-react/issue/3145 +[#3144]: https://github.com/yannickcr/eslint-plugin-react/issue/3144 [#3142]: https://github.com/yannickcr/eslint-plugin-react/pull/3142 [#3141]: https://github.com/yannickcr/eslint-plugin-react/pull/3141 [#3136]: https://github.com/yannickcr/eslint-plugin-react/pull/3136 diff --git a/lib/rules/display-name.js b/lib/rules/display-name.js index eb4c96122c..528b8f2d80 100644 --- a/lib/rules/display-name.js +++ b/lib/rules/display-name.js @@ -192,6 +192,9 @@ module.exports = { }, ObjectExpression(node) { + if (!utils.isES5Component(node)) { + return; + } if (ignoreTranspilerName || !hasTranspilerName(node)) { // Search for the displayName declaration node.properties.forEach((property) => { diff --git a/tests/lib/rules/display-name.js b/tests/lib/rules/display-name.js index e0babc2076..4ce226b27f 100644 --- a/tests/lib/rules/display-name.js +++ b/tests/lib/rules/display-name.js @@ -914,5 +914,32 @@ ruleTester.run('display-name', rule, { { message: 'Component definition is missing display name' }, ], }, + { + code: ` + const processData = (options?: { value: string }) => options?.value || 'no data'; + + export const Component = observer(() => { + const data = processData({ value: 'data' }); + return
{data}
; + }); + + export const Component2 = observer(() => { + const data = processData(); + return
{data}
; + }); + `, + features: ['optional chaining', 'types'], + settings: { componentWrapperFunctions: ['observer'] }, + errors: [ + { + message: 'Component definition is missing display name', + line: 4, + }, + { + message: 'Component definition is missing display name', + line: 9, + }, + ], + }, ]), });