Skip to content

Commit 9d9786a

Browse files
committed
New rule: no-toggle-all-classes; included in deprecated-3.0
$x.toggleClass(false) which turns off all classes was deprecated in 3.0, and will be removed in 4. Other signatures are unaffected, so make this a separate rule to `no-class`.
1 parent 2ff8458 commit 9d9786a

File tree

6 files changed

+128
-0
lines changed

6 files changed

+128
-0
lines changed

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@ Where rules are included in the configs `recommended`, `slim`, `all` or `depreca
170170
* [`no-jquery/no-sub`](docs/rules/no-sub.md) `1.7`, `all`
171171
* [`no-jquery/no-support`](docs/rules/no-support.md) `1.9`
172172
* [`no-jquery/no-text`](docs/rules/no-text.md) `all`
173+
* [`no-jquery/no-toggle-all-classes`](docs/rules/no-toggle-all-classes.md) `3.0`
173174
* [`no-jquery/no-trigger`](docs/rules/no-trigger.md) `all`
174175
* [`no-jquery/no-trim`](docs/rules/no-trim.md) `3.5`, `all`
175176
* [`no-jquery/no-type`](docs/rules/no-type.md) `3.3`, `all`
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
[//]: # (This file is generated by eslint-docgen. Do not edit it directly.)
2+
3+
# no-toggle-all-classes
4+
5+
Disallows using [`.toggleClass`](https://api.jquery.com/toggleClass/) to toggle all classes.
6+
7+
📋 This rule is enabled in `plugin:no-jquery/deprecated-3.0`.
8+
9+
## Rule details
10+
11+
❌ Examples of **incorrect** code:
12+
```js
13+
$div.toggleClass();
14+
$div.toggleClass( false );
15+
$div.toggleClass( true );
16+
$div.toggleClass( undefined );
17+
```
18+
19+
✔️ Examples of **correct** code:
20+
```js
21+
$div.attr( 'class', '' );
22+
$div.removeClass( 'myClass' );
23+
toggleClass( false );
24+
obj.toggleClass( false );
25+
$div.toggleClass( 'myClass', true );
26+
$div.toggleClass( 'myClass', false );
27+
$div.toggleClass( 'myClass' );
28+
$div.toggleClass( 'myClass', undefined );
29+
```
30+
31+
## Resources
32+
33+
* [Rule source](/src/rules/no-toggle-all-classes.js)
34+
* [Test source](/tests/rules/no-toggle-all-classes.js)

src/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -92,6 +92,7 @@ module.exports = {
9292
'no-support': require( './rules/no-support' ),
9393
'no-text': require( './rules/no-text' ),
9494
'no-toggle': require( './rules/no-toggle' ),
95+
'no-toggle-all-classes': require( './rules/no-toggle-all-classes' ),
9596
'no-trigger': require( './rules/no-trigger' ),
9697
'no-trim': require( './rules/no-trim' ),
9798
'no-type': require( './rules/no-type' ),
@@ -184,6 +185,7 @@ module.exports = {
184185
'no-jquery/no-fx-interval': 'warn',
185186
'no-jquery/no-parse-json': 'warn',
186187
'no-jquery/no-ready-shorthand': 'warn',
188+
'no-jquery/no-toggle-all-classes': 'warn',
187189
'no-jquery/no-unique': 'warn'
188190
}
189191
},

src/rules/no-toggle-all-classes.js

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
'use strict';
2+
3+
const utils = require( '../utils.js' );
4+
5+
module.exports = {
6+
meta: {
7+
type: 'suggestion',
8+
docs: {
9+
description: 'Disallows using ' + utils.jQueryCollectionLink( 'toggleClass' ) + ' to toggle all classes.'
10+
},
11+
schema: []
12+
},
13+
14+
create: ( context ) => ( {
15+
'CallExpression:exit': ( node ) => {
16+
if ( node.callee.type !== 'MemberExpression' ) {
17+
return;
18+
}
19+
const name = node.callee.property.name;
20+
if ( name !== 'toggleClass' || utils.isjQueryConstructor( context, node.callee.object.name ) ) {
21+
return;
22+
}
23+
24+
if ( node.arguments.length >= 2 ) {
25+
return;
26+
}
27+
if ( node.arguments.length === 1 ) {
28+
const arg = node.arguments[ 0 ];
29+
if (
30+
!(
31+
arg.type === 'Literal' &&
32+
( arg.value === true || arg.value === false )
33+
) &&
34+
!(
35+
arg.type === 'Identifier' && arg.name === 'undefined'
36+
)
37+
) {
38+
return;
39+
}
40+
}
41+
42+
if ( utils.isjQuery( context, node.callee ) ) {
43+
context.report( {
44+
node,
45+
message: '.toggleClass(boolean|undefined) is deprecated'
46+
} );
47+
}
48+
}
49+
} )
50+
};

test-self/deprecated-3.0/test.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,9 @@ $x.ready();
2929
// eslint-disable-next-line self/no-unique
3030
$.unique();
3131

32+
// eslint-disable-next-line self/no-toggle-all-classes
33+
$x.toggleClass( false );
34+
3235
/* 1.10 */
3336
// eslint-disable-next-line self/no-context-prop
3437
$x.context;
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
'use strict';
2+
3+
const rule = require( '../../src/rules/no-toggle-all-classes' );
4+
const RuleTester = require( '../../tools/rule-tester' );
5+
6+
const toggleError = '.toggleClass(boolean|undefined) is deprecated';
7+
8+
const ruleTester = new RuleTester();
9+
ruleTester.run( 'no-toggle-all-classes', rule, {
10+
valid: [
11+
'$div.attr("class", "")',
12+
'$div.removeClass("myClass")',
13+
'toggleClass(false)',
14+
'obj.toggleClass(false)',
15+
'$div.toggleClass("myClass", true)',
16+
'$div.toggleClass("myClass", false)',
17+
'$div.toggleClass("myClass")',
18+
'$div.toggleClass("myClass", undefined)'
19+
],
20+
invalid: [
21+
{
22+
code: '$div.toggleClass()',
23+
errors: [ toggleError ]
24+
},
25+
{
26+
code: '$div.toggleClass(false)',
27+
errors: [ toggleError ]
28+
},
29+
{
30+
code: '$div.toggleClass(true)',
31+
errors: [ toggleError ]
32+
},
33+
{
34+
code: '$div.toggleClass(undefined)',
35+
errors: [ toggleError ]
36+
}
37+
]
38+
} );

0 commit comments

Comments
 (0)