diff --git a/CHANGELOG.md b/CHANGELOG.md index 3bf5fee151..79b22a31bb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,8 +12,12 @@ This change log adheres to standards from [Keep a CHANGELOG](http://keepachangel ### Fixed * [`function-component-definition`]: ignore object properties ([#2771][] @stefan-wullems) * [`forbid-component-props`]: Implemented support for "namespaced" components ([#2767][] @mnn) +* [`prefer-read-only-props`]: support Flow `$ReadOnly` ([#2772][], [#2779][], [#2770][] @karolina-benitez) +[#2779]: https://github.com/yannickcr/eslint-plugin-react/pull/2779 +[#2772]: https://github.com/yannickcr/eslint-plugin-react/pull/2772 [#2771]: https://github.com/yannickcr/eslint-plugin-react/pull/2771 +[#2770]: https://github.com/yannickcr/eslint-plugin-react/pull/2770 [#2767]: https://github.com/yannickcr/eslint-plugin-react/pull/2767 [#2761]: https://github.com/yannickcr/eslint-plugin-react/pull/2761 [#2748]: https://github.com/yannickcr/eslint-plugin-react/pull/2748 diff --git a/lib/rules/prefer-read-only-props.js b/lib/rules/prefer-read-only-props.js index 8349435f24..3a1faff94a 100644 --- a/lib/rules/prefer-read-only-props.js +++ b/lib/rules/prefer-read-only-props.js @@ -13,7 +13,7 @@ function isFlowPropertyType(node) { } function isCovariant(node) { - return node.variance && node.variance.kind === 'plus'; + return node.variance && node.variance.kind === 'plus' || node.parent.parent.parent.id && node.parent.parent.parent.id.name === '$ReadOnly'; } // ------------------------------------------------------------------------------ diff --git a/tests/lib/rules/prefer-read-only-props.js b/tests/lib/rules/prefer-read-only-props.js index 9445605c68..f1bc224a38 100644 --- a/tests/lib/rules/prefer-read-only-props.js +++ b/tests/lib/rules/prefer-read-only-props.js @@ -131,6 +131,37 @@ ruleTester.run('prefer-read-only-props', rule, { name: PropTypes.string, }; ` + }, + { + // Class component with typed props argument + code: ` + type Props = $ReadOnly<{ + name: string, + }> + + class Hello extends React.Component { + render () { + return
Hello {this.props.name}
; + } + } + `, + parser: parsers.BABEL_ESLINT + }, + { + // Class component with typed props argument + code: ` + type Props = $ReadOnly<{ + +firstName: string, + lastName: string + }> + + class Hello extends React.Component { + render () { + return
Hello {this.props.firstName} {this.props.lastName}
; + } + } + `, + parser: parsers.BABEL_ESLINT } ],