forbid-component-props: add component whitelist

Author: ThiefMaster

lib/rules/forbid-component-props.js

@@ -31,20 +31,40 @@ module.exports = {
         forbid: {
           type: 'array',
           items: {
-            type: 'string'
+            oneOf: [{
+              type: 'string'
+            }, {
+              type: 'object',
+              properties: {
+                propName: {
+                  type: 'string'
+                },
+                allowedFor: {
+                  type: 'array',
+                  items: {
+                    type: 'string'
+                  }
+                }
+              }
+            }]
           }
         }
-      },
-      additionalProperties: true
+      }
     }]
   },
 
   create: function(context) {
-    function isForbidden(prop) {
-      const configuration = context.options[0] || {};
+    const configuration = context.options[0] || {};
+    const forbid = new Map((configuration.forbid || DEFAULTS).map((value) => {
+      const propName = (typeof value === 'string') ? value : value.propName;
+      const whitelist = (typeof value === 'string') ? [] : (value.allowedFor || []);
+      return [propName, whitelist];
+    }));
 
-      const forbid = configuration.forbid || DEFAULTS;
-      return forbid.indexOf(prop) >= 0;
+    function isForbidden(prop, tagName) {
+      const whitelist = forbid.get(prop);
+      // if the tagName is undefined (`<this.something>`), we assume it's a forbidden element
+      return typeof whitelist !== 'undefined' && (typeof tagName === 'undefined' || !whitelist.includes(tagName));
     }
 
     return {
@@ -57,7 +77,7 @@ module.exports = {
 
         const prop = node.name.name;
 
-        if (!isForbidden(prop)) {
+        if (!isForbidden(prop, tag)) {
           return;
         }
 

tests/lib/rules/forbid-component-props.js

@@ -101,6 +101,11 @@ ruleTester.run('forbid-component-props', rule, {
       '  <this.Foo {...props} />',
       ');'
     ].join('\n')
+  }, {
+    code: 'const item = (<ReactModal className="foo" />);',
+    options: [{
+      forbid: [{propName: 'className', allowedFor: ['ReactModal']}]
+    }]
   }],
 
   invalid: [{
@@ -165,5 +170,27 @@ ruleTester.run('forbid-component-props', rule, {
       column: 17,
       type: 'JSXAttribute'
     }]
+  }, {
+    code: 'const item = (<Foo className="foo" />);',
+    options: [{
+      forbid: [{propName: 'className', allowedFor: ['ReactModal']}]
+    }],
+    errors: [{
+      message: CLASSNAME_ERROR_MESSAGE,
+      line: 1,
+      column: 20,
+      type: 'JSXAttribute'
+    }]
+  }, {
+    code: 'const item = (<this.ReactModal className="foo" />);',
+    options: [{
+      forbid: [{propName: 'className', allowedFor: ['ReactModal']}]
+    }],
+    errors: [{
+      message: CLASSNAME_ERROR_MESSAGE,
+      line: 1,
+      column: 32,
+      type: 'JSXAttribute'
+    }]
   }]
 });