1 | /**
|
---|
2 | * @fileoverview Prevent usage of setState in lifecycle methods
|
---|
3 | * @author Yannick Croissant
|
---|
4 | */
|
---|
5 |
|
---|
6 | 'use strict';
|
---|
7 |
|
---|
8 | const findLast = require('array.prototype.findlast');
|
---|
9 |
|
---|
10 | const docsUrl = require('./docsUrl');
|
---|
11 | const report = require('./report');
|
---|
12 | const getAncestors = require('./eslint').getAncestors;
|
---|
13 | const testReactVersion = require('./version').testReactVersion;
|
---|
14 |
|
---|
15 | // ------------------------------------------------------------------------------
|
---|
16 | // Rule Definition
|
---|
17 | // ------------------------------------------------------------------------------
|
---|
18 |
|
---|
19 | function mapTitle(methodName) {
|
---|
20 | const map = {
|
---|
21 | componentDidMount: 'did-mount',
|
---|
22 | componentDidUpdate: 'did-update',
|
---|
23 | componentWillUpdate: 'will-update',
|
---|
24 | };
|
---|
25 | const title = map[methodName];
|
---|
26 | if (!title) {
|
---|
27 | throw Error(`No docsUrl for '${methodName}'`);
|
---|
28 | }
|
---|
29 | return `no-${title}-set-state`;
|
---|
30 | }
|
---|
31 |
|
---|
32 | const messages = {
|
---|
33 | noSetState: 'Do not use setState in {{name}}',
|
---|
34 | };
|
---|
35 |
|
---|
36 | const methodNoopsAsOf = {
|
---|
37 | componentDidMount: '>= 16.3.0',
|
---|
38 | componentDidUpdate: '>= 16.3.0',
|
---|
39 | };
|
---|
40 |
|
---|
41 | function shouldBeNoop(context, methodName) {
|
---|
42 | return methodName in methodNoopsAsOf
|
---|
43 | && testReactVersion(context, methodNoopsAsOf[methodName])
|
---|
44 | && !testReactVersion(context, '999.999.999'); // for when the version is not specified
|
---|
45 | }
|
---|
46 |
|
---|
47 | module.exports = function makeNoMethodSetStateRule(methodName, shouldCheckUnsafeCb) {
|
---|
48 | return {
|
---|
49 | meta: {
|
---|
50 | docs: {
|
---|
51 | description: `Disallow usage of setState in ${methodName}`,
|
---|
52 | category: 'Best Practices',
|
---|
53 | recommended: false,
|
---|
54 | url: docsUrl(mapTitle(methodName)),
|
---|
55 | },
|
---|
56 |
|
---|
57 | messages,
|
---|
58 |
|
---|
59 | schema: [{
|
---|
60 | enum: ['disallow-in-func'],
|
---|
61 | }],
|
---|
62 | },
|
---|
63 |
|
---|
64 | create(context) {
|
---|
65 | const mode = context.options[0] || 'allow-in-func';
|
---|
66 |
|
---|
67 | function nameMatches(name) {
|
---|
68 | if (name === methodName) {
|
---|
69 | return true;
|
---|
70 | }
|
---|
71 |
|
---|
72 | if (typeof shouldCheckUnsafeCb === 'function' && shouldCheckUnsafeCb(context)) {
|
---|
73 | return name === `UNSAFE_${methodName}`;
|
---|
74 | }
|
---|
75 |
|
---|
76 | return false;
|
---|
77 | }
|
---|
78 |
|
---|
79 | if (shouldBeNoop(context, methodName)) {
|
---|
80 | return {};
|
---|
81 | }
|
---|
82 |
|
---|
83 | // --------------------------------------------------------------------------
|
---|
84 | // Public
|
---|
85 | // --------------------------------------------------------------------------
|
---|
86 |
|
---|
87 | return {
|
---|
88 | CallExpression(node) {
|
---|
89 | const callee = node.callee;
|
---|
90 | if (
|
---|
91 | callee.type !== 'MemberExpression'
|
---|
92 | || callee.object.type !== 'ThisExpression'
|
---|
93 | || callee.property.name !== 'setState'
|
---|
94 | ) {
|
---|
95 | return;
|
---|
96 | }
|
---|
97 | const ancestors = getAncestors(context, node);
|
---|
98 | let depth = 0;
|
---|
99 | findLast(ancestors, (ancestor) => {
|
---|
100 | // ancestors.some((ancestor) => {
|
---|
101 | if (/Function(Expression|Declaration)$/.test(ancestor.type)) {
|
---|
102 | depth += 1;
|
---|
103 | }
|
---|
104 | if (
|
---|
105 | (ancestor.type !== 'Property' && ancestor.type !== 'MethodDefinition' && ancestor.type !== 'ClassProperty' && ancestor.type !== 'PropertyDefinition')
|
---|
106 | || !nameMatches(ancestor.key.name)
|
---|
107 | || (mode !== 'disallow-in-func' && depth > 1)
|
---|
108 | ) {
|
---|
109 | return false;
|
---|
110 | }
|
---|
111 | report(context, messages.noSetState, 'noSetState', {
|
---|
112 | node: callee,
|
---|
113 | data: {
|
---|
114 | name: ancestor.key.name,
|
---|
115 | },
|
---|
116 | });
|
---|
117 | return true;
|
---|
118 | });
|
---|
119 | },
|
---|
120 | };
|
---|
121 | },
|
---|
122 | };
|
---|
123 | };
|
---|