diff --git a/docs/rules/boolean-prop-naming.md b/docs/rules/boolean-prop-naming.md index 013e98f22e..71f4adb65b 100644 --- a/docs/rules/boolean-prop-naming.md +++ b/docs/rules/boolean-prop-naming.md @@ -30,7 +30,7 @@ var Hello = createReactClass({ ```js ... -"react/boolean-prop-naming": [, { "propTypeNames": Array, "rule": }] +"react/boolean-prop-naming": [, { "propTypeNames": Array, "rule": , "message": }] ... ``` @@ -65,3 +65,24 @@ For supporting "is" naming: ```jsx "react/boolean-prop-naming": ["error", { "rule": "^is[A-Z]([A-Za-z0-9]?)+" }] ``` + +### `message` + +The custom message to display upon failure to match the rule. This overrides the default message. + +If you choose to use a custom message, you have access to two template variables. + +* `propName` – the name of the prop that does not match the pattern +* `pattern` – the pattern against which all prop names are tested + +For example, if a prop is named `something`, and if the rule's pattern is set to `"^(is|has)[A-Z]([A-Za-z0-9]?)+"`, you could set the custom message as follows: + +```js +message: 'It is better if your prop ({{ propName }}) matches this pattern: ({{ pattern }})' +``` + +And the failure would look like so: + +``` +It is better if your prop (something) matches this pattern: (^is[A-Z]([A-Za-z0-9]?)+) +``` diff --git a/lib/rules/boolean-prop-naming.js b/lib/rules/boolean-prop-naming.js index 45ae8f1b78..6b09b4ba32 100644 --- a/lib/rules/boolean-prop-naming.js +++ b/lib/rules/boolean-prop-naming.js @@ -35,6 +35,10 @@ module.exports = { default: '^(is|has)[A-Z]([A-Za-z0-9]?)+', minLength: 1, type: 'string' + }, + message: { + minLength: 1, + type: 'string' } }, type: 'object' @@ -131,9 +135,11 @@ module.exports = { const propName = getPropName(propNode); context.report({ node: propNode, - message: `Prop name (${propName}) doesn't match rule (${config.rule})`, + message: config.message || 'Prop name ({{ propName }}) doesn\'t match rule ({{ pattern }})', data: { - component: propName + component: propName, + propName: propName, + pattern: config.rule } }); }); diff --git a/tests/lib/rules/boolean-prop-naming.js b/tests/lib/rules/boolean-prop-naming.js index fa05ec6874..9a49622b4d 100644 --- a/tests/lib/rules/boolean-prop-naming.js +++ b/tests/lib/rules/boolean-prop-naming.js @@ -634,5 +634,35 @@ ruleTester.run('boolean-prop-naming', rule, { errors: [{ message: 'Prop name (showScore) doesn\'t match rule (^(is|has)[A-Z]([A-Za-z0-9]?)+)' }] + }, { + // If a custom message is provided, use it. + code: ` + class Hello extends React.Component { + render () { return
; } + } + Hello.propTypes = {something: PropTypes.bool} + `, + options: [{ + rule: '^is[A-Z]([A-Za-z0-9]?)+', + message: 'Boolean prop names must begin with either \'is\' or \'has\'' + }], + errors: [{ + message: 'Boolean prop names must begin with either \'is\' or \'has\'' + }] + }, { + // Custom messages use ESLint string templating. + code: ` + class Hello extends React.Component { + render () { return
; } + } + Hello.propTypes = {something: PropTypes.bool} + `, + options: [{ + rule: '^is[A-Z]([A-Za-z0-9]?)+', + message: 'It is better if your prop ({{ propName }}) matches this pattern: ({{ pattern }})' + }], + errors: [{ + message: 'It is better if your prop (something) matches this pattern: (^is[A-Z]([A-Za-z0-9]?)+)' + }] }] });