Merge 6ba4150 into 80f3826

jsx-eslint · Apr 3, 2020 · 1208d4c · 1208d4c
2 parents 80f3826 + 6ba4150
commit 1208d4c
Show file tree

Hide file tree

Showing 6 changed files with 52 additions and 6 deletions.
diff --git a/docs/rules/forbid-component-props.md b/docs/rules/forbid-component-props.md
@@ -35,7 +35,7 @@ The following patterns are **not** considered warnings:
 
 ```js
 ...
-"react/forbid-component-props": [<enabled>, { "forbid": [<string>|<object>] }]
+"react/forbid-component-props": [<enabled>, { "forbid": [<string>|<object>], "message": <string> }]
 ...
 ```
 
@@ -51,6 +51,9 @@ Each array element can either be a string with the property name or object speci
 }
 ```
 
+### `message`
+
+A custom message to provide with the error. The default message is ``Prop `${prop}` is forbidden on Components``
 
 ### Related rules
 

diff --git a/docs/rules/forbid-dom-props.md b/docs/rules/forbid-dom-props.md
@@ -36,14 +36,17 @@ The following patterns are **not** considered warnings:
 
 ```js
 ...
-"react/forbid-dom-props": [<enabled>, { "forbid": [<string>] }]
+"react/forbid-dom-props": [<enabled>, { "forbid": [<string>], "message": <string> }]
 ...
 ```
 
 ### `forbid`
 
 An array of strings, with the names of props that are forbidden. The default value of this option `[]`.
 
+### `message`
+
+A custom message to provide with the error. The default message is ``Prop `${prop}` is forbidden on DOM Nodes``
 
 ### Related rules
 

diff --git a/lib/rules/forbid-component-props.js b/lib/rules/forbid-component-props.js
@@ -50,6 +50,9 @@ module.exports = {
               }
             }]
           }
+        },
+        message: {
+          type: 'string'
         }
       }
     }]
@@ -62,6 +65,7 @@ module.exports = {
       const whitelist = typeof value === 'string' ? [] : (value.allowedFor || []);
       return [propName, whitelist];
     }));
+    const customMessage = configuration.message;
 
     function isForbidden(prop, tagName) {
       const whitelist = forbid.get(prop);
@@ -83,9 +87,11 @@ module.exports = {
           return;
         }
 
+        const errorMessage = customMessage || `Prop \`${prop}\` is forbidden on Components`;
+
         context.report({
           node,
-          message: `Prop \`${prop}\` is forbidden on Components`
+          message: errorMessage
         });
       }
     };

diff --git a/lib/rules/forbid-dom-props.js b/lib/rules/forbid-dom-props.js
@@ -36,16 +36,20 @@ module.exports = {
             minLength: 1
           },
           uniqueItems: true
+        },
+        message: {
+          type: 'string'
         }
       },
       additionalProperties: false
     }]
   },
 
   create(context) {
-    function isForbidden(prop) {
-      const configuration = context.options[0] || {};
+    const configuration = context.options[0] || {};
+    const customMessage = configuration.message;
 
+    function isForbidden(prop) {
       const forbid = configuration.forbid || DEFAULTS;
       return forbid.indexOf(prop) >= 0;
     }
@@ -64,9 +68,11 @@ module.exports = {
           return;
         }
 
+        const errorMessage = customMessage || `Prop \`${prop}\` is forbidden on DOM Nodes`;
+
         context.report({
           node,
-          message: `Prop \`${prop}\` is forbidden on DOM Nodes`
+          message: errorMessage
         });
       }
     };

diff --git a/tests/lib/rules/forbid-component-props.js b/tests/lib/rules/forbid-component-props.js
@@ -190,5 +190,17 @@ ruleTester.run('forbid-component-props', rule, {
       column: 32,
       type: 'JSXAttribute'
     }]
+  }, {
+    code: 'const item = (<Foo className="foo" />);',
+    options: [{
+      forbid: [{propName: 'className'}],
+      message: 'Please use ourCoolClassName instead of ClassName'
+    }],
+    errors: [{
+      message: 'Please use ourCoolClassName instead of ClassName',
+      line: 1,
+      column: 20,
+      type: 'JSXAttribute'
+    }]
   }]
 });
diff --git a/tests/lib/rules/forbid-dom-props.js b/tests/lib/rules/forbid-dom-props.js
@@ -126,5 +126,21 @@ ruleTester.run('forbid-element-props', rule, {
       column: 8,
       type: 'JSXAttribute'
     }]
+  }, {
+    code: [
+      'const First = (props) => (',
+      '  <div className="foo" />',
+      ');'
+    ].join('\n'),
+    options: [{
+      forbid: ['className'],
+      message: 'Please use class instead of ClassName'
+    }],
+    errors: [{
+      message: 'Please use class instead of ClassName',
+      line: 2,
+      column: 8,
+      type: 'JSXAttribute'
+    }]
   }]
 });