Skip to content

Commit 50061e4

Browse files
committed
Add jsx-boolean-value rule (fixes #11)
1 parent 62ba591 commit 50061e4

File tree

5 files changed

+107
-2
lines changed

5 files changed

+107
-2
lines changed

README.md

100644100755
Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ Finally, enable all of the rules that you would like to use.
4343
{
4444
"rules": {
4545
"react/display-name": 1,
46+
"react/jsx-boolean-value": 1,
4647
"react/jsx-quotes": 1,
4748
"react/jsx-no-undef": 1,
4849
"react/jsx-sort-props": 1,
@@ -63,6 +64,7 @@ Finally, enable all of the rules that you would like to use.
6364
# List of supported rules
6465

6566
* [display-name](docs/rules/display-name.md): Prevent missing displayName in a React component definition
67+
* [jsx-boolean-value](docs/rules/jsx-boolean-value.md): Enforce boolean attributes notation in JSX
6668
* [jsx-quotes](docs/rules/jsx-quotes.md): Enforce quote style for JSX attributes
6769
* [jsx-no-undef](docs/rules/jsx-no-undef.md): Disallow undeclared variables in JSX
6870
* [jsx-sort-props](docs/rules/jsx-sort-props.md): Enforce props alphabetical sorting

docs/rules/jsx-boolean-value.md

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# Enforce boolean attributes notation in JSX (jsx-boolean-value)
2+
3+
In JSX when using a boolean attribute you can set the attribute value to `true` or omit the value. This rule will enforce one or the other to keep consistency in your code.
4+
5+
## Rule Details
6+
7+
This rule takes one argument. If it is `"always"` then it warns whenever an attribute is missing it's value. If `"never"` then it warns if an attribute has a `true` value. The default value of this option is `"never"`.
8+
9+
The following patterns are considered warnings when configured `"never"`:
10+
11+
```js
12+
var Hello = <Hello personal={true} />;
13+
```
14+
15+
The following patterns are not considered warnings when configured `"never"`:
16+
17+
```js
18+
var Hello = <Hello personal />;
19+
```
20+
21+
The following patterns are considered warnings when configured `"always"`:
22+
23+
```js
24+
var Hello = <Hello personal />;
25+
```
26+
27+
The following patterns are not considered warnings when configured `"always"`:
28+
29+
```js
30+
var Hello = <Hello personal={true} />;
31+
```
32+
33+
## When Not To Use It
34+
35+
If you do not want to enforce any style for boolean attributes, then you can disable this rule.

index.js

100644100755
Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,8 @@ module.exports = {
1515
'jsx-no-undef': require('./lib/rules/jsx-no-undef'),
1616
'jsx-quotes': require('./lib/rules/jsx-quotes'),
1717
'no-unknown-property': require('./lib/rules/no-unknown-property'),
18-
'jsx-sort-props': require('./lib/rules/jsx-sort-props')
18+
'jsx-sort-props': require('./lib/rules/jsx-sort-props'),
19+
'jsx-boolean-value': require('./lib/rules/jsx-boolean-value')
1920
},
2021
rulesConfig: {
2122
'jsx-uses-react': 0,
@@ -31,6 +32,7 @@ module.exports = {
3132
'jsx-no-undef': 0,
3233
'jsx-quotes': 0,
3334
'no-unknown-property': 0,
34-
'jsx-sort-props': 0
35+
'jsx-sort-props': 0,
36+
'jsx-boolean-value': 0
3537
}
3638
};

lib/rules/jsx-boolean-value.js

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/**
2+
* @fileoverview Enforce boolean attributes notation in JSX
3+
* @author Yannick Croissant
4+
*/
5+
'use strict';
6+
7+
// ------------------------------------------------------------------------------
8+
// Rule Definition
9+
// ------------------------------------------------------------------------------
10+
11+
module.exports = function(context) {
12+
13+
var configuration = context.options[0] || {};
14+
15+
var NEVER_MESSAGE = 'Value must be omitted for boolean attributes';
16+
var ALWAYS_MESSAGE = 'Value must be set for boolean attributes';
17+
18+
return {
19+
JSXAttribute: function(node) {
20+
switch (configuration) {
21+
case 'always':
22+
if (node.value === null) {
23+
context.report(node, ALWAYS_MESSAGE);
24+
}
25+
break;
26+
case 'never':
27+
if (node.value && node.value.type === 'JSXExpressionContainer' && node.value.expression.value === true) {
28+
context.report(node, NEVER_MESSAGE);
29+
}
30+
break;
31+
default:
32+
break;
33+
}
34+
}
35+
};
36+
};

tests/lib/rules/jsx-boolean-value.js

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
/**
2+
* @fileoverview Enforce boolean attributes notation in JSX
3+
* @author Yannick Croissant
4+
*/
5+
'use strict';
6+
7+
// ------------------------------------------------------------------------------
8+
// Requirements
9+
// ------------------------------------------------------------------------------
10+
11+
var eslint = require('eslint').linter;
12+
var ESLintTester = require('eslint-tester');
13+
14+
// ------------------------------------------------------------------------------
15+
// Tests
16+
// ------------------------------------------------------------------------------
17+
18+
var eslintTester = new ESLintTester(eslint);
19+
eslintTester.addRuleTest('lib/rules/jsx-boolean-value', {
20+
valid: [
21+
{code: '<App foo />;', args: [1, 'never'], ecmaFeatures: {jsx: true}},
22+
{code: '<App foo={true} />;', args: [1, 'always'], ecmaFeatures: {jsx: true}}
23+
],
24+
invalid: [
25+
{code: '<App foo={true} />;', args: [1, 'never'],
26+
errors: [{message: 'Value must be omitted for boolean attributes'}], ecmaFeatures: {jsx: true}},
27+
{code: '<App foo />;', args: [1, 'always'],
28+
errors: [{message: 'Value must be set for boolean attributes'}], ecmaFeatures: {jsx: true}}
29+
]
30+
});

0 commit comments

Comments
 (0)