From c00ac9aeb7d975b619d0c5c54127db9d7314fdac Mon Sep 17 00:00:00 2001 From: Duncan Beevers Date: Tue, 23 Nov 2021 07:57:50 -0800 Subject: [PATCH] fixup! [New] Symmetric useState hook variable names --- lib/rules/hook-use-state.js | 16 ++-- tests/lib/rules/hook-use-state.js | 148 +++++++++++++++--------------- 2 files changed, 81 insertions(+), 83 deletions(-) diff --git a/lib/rules/hook-use-state.js b/lib/rules/hook-use-state.js index 57f9ec6633..5d1a2a5b5f 100644 --- a/lib/rules/hook-use-state.js +++ b/lib/rules/hook-use-state.js @@ -19,16 +19,16 @@ module.exports = { description: 'Ensure symmetric naming of useState hook value and setter variables', category: 'Best Practices', recommended: false, - url: docsUrl('hook-use-state') + url: docsUrl('hook-use-state'), }, fixable: 'code', messages: { - [USE_STATE_ERROR_MESSAGE]: 'setState call is not destructured into value + setter pair' + [USE_STATE_ERROR_MESSAGE]: 'setState call is not destructured into value + setter pair', }, schema: [{ type: 'object', - additionalProperties: false - }] + additionalProperties: false, + }], }, create(context) { @@ -63,7 +63,7 @@ module.exports = { ); if (!isDestructuringDeclarator) { - context.report({node, messageId: USE_STATE_ERROR_MESSAGE}); + context.report({ node, messageId: USE_STATE_ERROR_MESSAGE }); return; } @@ -97,7 +97,7 @@ module.exports = { fix: valueVariableName ? (fixer) => fixer.replaceTextRange( [node.parent.id.range[0], node.parent.id.range[1]], `[${valueVariableName}, ${expectedSetterVariableName}]` - ) : undefined + ) : undefined, }); } }, @@ -118,7 +118,7 @@ module.exports = { reactUseStateLocalName = reactUseStateSpecifier ? reactUseStateSpecifier.local.name : undefined; - } + }, }; - } + }, }; diff --git a/tests/lib/rules/hook-use-state.js b/tests/lib/rules/hook-use-state.js index 970a5f08a1..ca88ace561 100644 --- a/tests/lib/rules/hook-use-state.js +++ b/tests/lib/rules/hook-use-state.js @@ -20,208 +20,206 @@ const parsers = require('../../helpers/parsers'); const ruleTester = new RuleTester({ parserOptions: { ecmaVersion: 2018, - sourceType: 'module' - } + sourceType: 'module', + }, }); const tests = { - valid: [ + valid: parsers.all([ { code: `import { useState } from 'react'; - const [color, setColor] = useState()` + const [color, setColor] = useState()`, }, { code: `import { useState } from 'react'; - const [color, setColor] = useState('#ffffff')` + const [color, setColor] = useState('#ffffff')`, }, { code: `import { useState } from 'react'; - const [color, setColor] = React.useState()` + const [color, setColor] = React.useState()`, }, { code: `import { useState } from 'react'; - const [color1, setColor1] = useState()` + const [color1, setColor1] = useState()`, }, { - code: 'const result = useState()' + code: 'const result = useState()', }, { - code: `import { useRef } from 'react'; - const result = useState()` + code: 'const [color, setFlavor] = useState()', }, { - code: 'const result = React.useState()' + code: `import { useRef } from 'react'; + const result = useState()`, }, { - code: `import { useState } from 'react'; - const [color, setColor] = useState()`, - parser: parsers.TYPESCRIPT_ESLINT + code: 'const result = React.useState()', }, - { - code: `import { useState } from 'react'; - const [color, setColor] = useState('#ffffff')`, - parser: parsers.TYPESCRIPT_ESLINT - } - ].concat(parsers.TS([ { code: `import { useState } from 'react'; const [color, setColor] = useState()`, - parser: parsers['@TYPESCRIPT_ESLINT'] + features: ['ts'], }, { code: `import { useState } from 'react'; const [color, setColor] = useState('#ffffff')`, - parser: parsers['@TYPESCRIPT_ESLINT'] - } - ]) - ), - invalid: [ + features: ['ts'], + }, + ]), + invalid: parsers.all([ { code: `import { useState } from 'react'; useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState as useStateAlternativeName } from 'react'; useStateAlternativeName()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import React from 'react'; const result = React.useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import ReactAlternative from 'react'; ReactAlternative.useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState } from 'react'; const result = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState } from 'react'; const [, , extra1] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState } from 'react'; const [, setColor] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState } from 'react'; const { color } = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState } from 'react'; const [] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState } from 'react'; const [, , , ,] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState } from 'react'; const [color] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' + message: 'setState call is not destructured into value + setter pair', }], output: `import { useState } from 'react'; - const [color, setColor] = useState()` + const [color, setColor] = useState()`, }, { code: `import { useState } from 'react'; const [color, , extra1] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' + message: 'setState call is not destructured into value + setter pair', }], output: `import { useState } from 'react'; - const [color, setColor] = useState()` + const [color, setColor] = useState()`, }, { code: `import { useState } from 'react'; const [color, setColor, extra1, extra2, extra3] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' + message: 'setState call is not destructured into value + setter pair', }], output: `import { useState } from 'react'; - const [color, setColor] = useState()` + const [color, setColor] = useState()`, }, { code: `import { useState } from 'react'; const [, makeColor] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' - }] + message: 'setState call is not destructured into value + setter pair', + }], }, { code: `import { useState } from 'react'; const [color, setFlavor, extraneous] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' + message: 'setState call is not destructured into value + setter pair', }], output: `import { useState } from 'react'; - const [color, setColor] = useState()` + const [color, setColor] = useState()`, }, { code: `import { useState } from 'react'; const [color, setFlavor] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' + message: 'setState call is not destructured into value + setter pair', }], output: `import { useState } from 'react'; - const [color, setColor] = useState()` + const [color, setColor] = useState()`, }, { code: `import { useState } from 'react'; const [color, setFlavor] = useState()`, errors: [{ - message: 'setState call is not destructured into value + setter pair' + message: 'setState call is not destructured into value + setter pair', }], output: `import { useState } from 'react'; const [color, setColor] = useState()`, - parser: parsers.TYPESCRIPT_ESLINT - } - ].concat( - parsers.TS([ - { - code: `import { useState } from 'react'; - const [color, setFlavor] = useState()`, - errors: [{ - message: 'setState call is not destructured into value + setter pair' - }], - output: `import { useState } from 'react'; - const [color, setColor] = useState()`, - parser: parsers['@TYPESCRIPT_ESLINT'] - } - ]) - ) + features: ['ts'], + }, + { + code: `import { useState } from 'react'; + const [color, setFlavor] = useState('#ffffff')`, + errors: [{ + message: 'setState call is not destructured into value + setter pair', + }], + output: `import { useState } from 'react'; + const [color, setColor] = useState('#ffffff')`, + features: ['ts'], + }, + { + code: `import React from 'react'; + const [color, setFlavor] = React.useState('#ffffff')`, + errors: [{ + message: 'setState call is not destructured into value + setter pair', + }], + output: `import React from 'react'; + const [color, setColor] = React.useState('#ffffff')`, + features: ['ts'], + }, + ]), }; ruleTester.run('hook-set-state-names', rule, tests);