Merge pull request #1522 from jomasti/issue-1521

Account for defaultProps in prefer-stateless rule

Author: ljharb

docs/rules/prefer-stateless-function.md

@@ -6,7 +6,7 @@ Stateless functional components are simpler than class based components and will
 
 This rule will check your class based React components for
 
-* methods/properties other than `displayName`, `propTypes`, `render` and useless constructor (same detection as ESLint [no-useless-constructor rule](http://eslint.org/docs/rules/no-useless-constructor))
+* methods/properties other than `displayName`, `propTypes`, `contextTypes`, `defaultProps`, `render` and useless constructor (same detection as ESLint [no-useless-constructor rule](http://eslint.org/docs/rules/no-useless-constructor))
 * instance property other than `this.props` and `this.context`
 * extension of `React.PureComponent` (if the `ignorePureComponents` flag is true)
 * presence of `ref` attribute in JSX

lib/rules/prefer-stateless-function.js

@@ -216,12 +216,13 @@ module.exports = {
         const isDisplayName = name === 'displayName';
         const isPropTypes = name === 'propTypes' || name === 'props' && property.typeAnnotation;
         const contextTypes = name === 'contextTypes';
+        const defaultProps = name === 'defaultProps';
         const isUselessConstructor =
           property.kind === 'constructor' &&
           isRedundantSuperCall(property.value.body.body, property.value.params)
         ;
         const isRender = name === 'render';
-        return !isDisplayName && !isPropTypes && !contextTypes && !isUselessConstructor && !isRender;
+        return !isDisplayName && !isPropTypes && !contextTypes && !defaultProps && !isUselessConstructor && !isRender;
       });
     }
 

tests/lib/rules/prefer-stateless-function.js

@@ -496,10 +496,105 @@ ruleTester.run('prefer-stateless-function', rule, {
           }
         }
       `,
+      errors: [{
+        message: 'Component should be written as a pure function'
+      }]
+    }, {
+      code: `
+        class Foo extends React.Component {
+          static defaultProps = {
+            foo: true
+          }
+          render() {
+            const { foo } = this.props;
+            return foo ? <div /> : null;
+          }
+        }
+      `,
       parser: 'babel-eslint',
       errors: [{
         message: 'Component should be written as a pure function'
       }]
+    }, {
+      code: `
+        class Foo extends React.Component {
+          static get defaultProps() {
+            return {
+              foo: true
+            };
+          }
+          render() {
+            const { foo } = this.props;
+            return foo ? <div /> : null;
+          }
+        }
+      `,
+      errors: [{
+        message: 'Component should be written as a pure function'
+      }]
+    }, {
+      code: `
+        class Foo extends React.Component {
+          render() {
+            const { foo } = this.props;
+            return foo ? <div /> : null;
+          }
+        }
+        Foo.defaultProps = {
+          foo: true
+        };
+      `,
+      errors: [{
+        message: 'Component should be written as a pure function'
+      }]
+    }, {
+      code: `
+        class Foo extends React.Component {
+          static contextTypes = {
+            foo: PropTypes.boolean
+          }
+          render() {
+            const { foo } = this.context;
+            return foo ? <div /> : null;
+          }
+        }
+      `,
+      parser: 'babel-eslint',
+      errors: [{
+        message: 'Component should be written as a pure function'
+      }]
+    }, {
+      code: `
+        class Foo extends React.Component {
+          static get contextTypes() {
+            return {
+              foo: PropTypes.boolean
+            };
+          }
+          render() {
+            const { foo } = this.context;
+            return foo ? <div /> : null;
+          }
+        }
+      `,
+      errors: [{
+        message: 'Component should be written as a pure function'
+      }]
+    }, {
+      code: `
+        class Foo extends React.Component {
+          render() {
+            const { foo } = this.context;
+            return foo ? <div /> : null;
+          }
+        }
+        Foo.contextTypes = {
+          foo: PropTypes.boolean
+        };
+      `,
+      errors: [{
+        message: 'Component should be written as a pure function'
+      }]
     }
   ]
 });