[Fix] prefer-read-only-props: support Flow $ReadOnly

jsx-eslint · Aug 26, 2020 · c3d9a73 · c3d9a73
1 parent d6ee945
commit c3d9a73
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 1 deletion.
diff --git 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
@@ -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<Props> {
+          render () {
+            return <div>Hello {this.props.name}</div>;
+          }
+        }
+      `,
+      parser: parsers.BABEL_ESLINT
+    },
+    {
+      // Class component with typed props argument
+      code: `
+        type Props = $ReadOnly<{
+          +firstName: string,
+          lastName: string
+        }>
+
+        class Hello extends React.Component<Props> {
+          render () {
+            return <div>Hello {this.props.firstName} {this.props.lastName}</div>;
+          }
+        }
+      `,
+      parser: parsers.BABEL_ESLINT
     }
   ],