Add support for classes static properties (fixes #43)

Author: yannickcr

lib/rules/display-name.js

@@ -37,6 +37,17 @@ module.exports = function(context) {
    * @returns {Boolean} True if we are declaring a display name, false if not.
    */
   function isDisplayNameDeclaration(node) {
+
+    // Special case for class properties
+    // (babel-eslint does not expose property name so we have to rely on tokens)
+    if (node.type === 'ClassProperty') {
+      var tokens = context.getFirstTokens(node, 2);
+      if (tokens[0].value === 'displayName' || tokens[1].value === 'displayName') {
+        return true;
+      }
+      return false;
+    }
+
     return Boolean(
       node &&
       node.name === 'displayName'
@@ -72,6 +83,14 @@ module.exports = function(context) {
 
   return {
 
+    ClassProperty: function(node) {
+      if (!isDisplayNameDeclaration(node)) {
+        return;
+      }
+
+      markDisplayNameAsDeclared(node);
+    },
+
     MemberExpression: function(node) {
       if (!isDisplayNameDeclaration(node.property)) {
         return;

lib/rules/prop-types.js

@@ -42,10 +42,22 @@ module.exports = function(context) {
    * @returns {Boolean} True if we are declaring a prop, false if not.
    */
   function isPropTypesDeclaration(node) {
+
+    // Special case for class properties
+    // (babel-eslint does not expose property name so we have to rely on tokens)
+    if (node.type === 'ClassProperty') {
+      var tokens = context.getFirstTokens(node, 2);
+      if (tokens[0].value === 'propTypes' || tokens[1].value === 'propTypes') {
+        return true;
+      }
+      return false;
+    }
+
     return Boolean(
       node &&
       node.name === 'propTypes'
     );
+
   }
 
   /**
@@ -198,6 +210,14 @@ module.exports = function(context) {
 
   return {
 
+    ClassProperty: function(node) {
+      if (!isPropTypesDeclaration(node)) {
+        return;
+      }
+
+      markPropTypesAsDeclared(node, node.value);
+    },
+
     MemberExpression: function(node) {
       var type;
       if (isPropTypesUsage(node)) {

tests/lib/rules/display-name.js

@@ -11,6 +11,8 @@
 var eslint = require('eslint').linter;
 var ESLintTester = require('eslint-tester');
 
+require('babel-eslint');
+
 // ------------------------------------------------------------------------------
 // Tests
 // ------------------------------------------------------------------------------
@@ -70,6 +72,20 @@ eslintTester.addRuleTest('lib/rules/display-name', {
       classes: true,
       jsx: true
     }
+  }, {
+    code: [
+      'class Hello extends React.Component {',
+      '  static displayName = \'Widget\'',
+      '  render() {',
+      '    return <div>Hello {this.props.name}</div>;',
+      '  }',
+      '}'
+    ].join('\n'),
+    parser: 'babel-eslint',
+    ecmaFeatures: {
+      classes: true,
+      jsx: true
+    }
   }],
 
   invalid: [{

tests/lib/rules/prop-types.js

@@ -203,7 +203,7 @@ eslintTester.addRuleTest('lib/rules/prop-types', {
         destructuring: true,
         jsx: true
       }
-    }/*, {
+    }, {
       code: [
         'class Hello extends React.Component {',
         '  static propTypes = {',
@@ -220,7 +220,7 @@ eslintTester.addRuleTest('lib/rules/prop-types', {
         destructuring: true,
         jsx: true
       }
-    }*/
+    }
   ],
 
   invalid: [