Skip to content

Commit 292ebed

Browse files
authored
Merge pull request #1588 from louisscruz/bool-props-message
Allow for Boolean Prop Naming Custom Message
2 parents f6e4c89 + 37902d4 commit 292ebed

File tree

3 files changed

+60
-3
lines changed

3 files changed

+60
-3
lines changed

docs/rules/boolean-prop-naming.md

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ var Hello = createReactClass({
3030

3131
```js
3232
...
33-
"react/boolean-prop-naming": [<enabled>, { "propTypeNames": Array<string>, "rule": <string> }]
33+
"react/boolean-prop-naming": [<enabled>, { "propTypeNames": Array<string>, "rule": <string>, "message": <string> }]
3434
...
3535
```
3636

@@ -65,3 +65,24 @@ For supporting "is" naming:
6565
```jsx
6666
"react/boolean-prop-naming": ["error", { "rule": "^is[A-Z]([A-Za-z0-9]?)+" }]
6767
```
68+
69+
### `message`
70+
71+
The custom message to display upon failure to match the rule. This overrides the default message.
72+
73+
If you choose to use a custom message, you have access to two template variables.
74+
75+
* `propName` – the name of the prop that does not match the pattern
76+
* `pattern` – the pattern against which all prop names are tested
77+
78+
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:
79+
80+
```js
81+
message: 'It is better if your prop ({{ propName }}) matches this pattern: ({{ pattern }})'
82+
```
83+
84+
And the failure would look like so:
85+
86+
```
87+
It is better if your prop (something) matches this pattern: (^is[A-Z]([A-Za-z0-9]?)+)
88+
```

lib/rules/boolean-prop-naming.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,10 @@ module.exports = {
3535
default: '^(is|has)[A-Z]([A-Za-z0-9]?)+',
3636
minLength: 1,
3737
type: 'string'
38+
},
39+
message: {
40+
minLength: 1,
41+
type: 'string'
3842
}
3943
},
4044
type: 'object'
@@ -131,9 +135,11 @@ module.exports = {
131135
const propName = getPropName(propNode);
132136
context.report({
133137
node: propNode,
134-
message: `Prop name (${propName}) doesn't match rule (${config.rule})`,
138+
message: config.message || 'Prop name ({{ propName }}) doesn\'t match rule ({{ pattern }})',
135139
data: {
136-
component: propName
140+
component: propName,
141+
propName: propName,
142+
pattern: config.rule
137143
}
138144
});
139145
});

tests/lib/rules/boolean-prop-naming.js

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -634,5 +634,35 @@ ruleTester.run('boolean-prop-naming', rule, {
634634
errors: [{
635635
message: 'Prop name (showScore) doesn\'t match rule (^(is|has)[A-Z]([A-Za-z0-9]?)+)'
636636
}]
637+
}, {
638+
// If a custom message is provided, use it.
639+
code: `
640+
class Hello extends React.Component {
641+
render () { return <div />; }
642+
}
643+
Hello.propTypes = {something: PropTypes.bool}
644+
`,
645+
options: [{
646+
rule: '^is[A-Z]([A-Za-z0-9]?)+',
647+
message: 'Boolean prop names must begin with either \'is\' or \'has\''
648+
}],
649+
errors: [{
650+
message: 'Boolean prop names must begin with either \'is\' or \'has\''
651+
}]
652+
}, {
653+
// Custom messages use ESLint string templating.
654+
code: `
655+
class Hello extends React.Component {
656+
render () { return <div />; }
657+
}
658+
Hello.propTypes = {something: PropTypes.bool}
659+
`,
660+
options: [{
661+
rule: '^is[A-Z]([A-Za-z0-9]?)+',
662+
message: 'It is better if your prop ({{ propName }}) matches this pattern: ({{ pattern }})'
663+
}],
664+
errors: [{
665+
message: 'It is better if your prop (something) matches this pattern: (^is[A-Z]([A-Za-z0-9]?)+)'
666+
}]
637667
}]
638668
});

0 commit comments

Comments
 (0)