@samitouri / QOS-React-2 / commits / 84479046f7

reference not add to dependencies if only its type is used as typeof arg (#19316)

* reference not add to dependencies if only its type is used as typeof arg * Add a few more tests

Bianca Del Carretto committed Jul 13, 2020 at 18:57 UTC 84479046f789be7ae19b410df4c6041e25a31a55
2 files changed +132
packages/eslint-plugin-react-hooks/__tests__/ESLintRuleExhaustiveDeps-test.js
+128
@@ -6983,6 +6983,30 @@ const testsTypescript = {
6983 }
6984 `,
6985 },
6986 + {
6987 + code: normalizeIndent`
6988 + function MyComponent() {
6989 + const [state, setState] = React.useState<number>(0);
6990 +
6991 + useEffect(() => {
6992 + const someNumber: typeof state = 2;
6993 + setState(prevState => prevState + someNumber);
6994 + }, [])
6995 + }
6996 + `,
6997 + },
6998 + {
6999 + code: normalizeIndent`
7000 + function App() {
7001 + const foo = {x: 1};
7002 + React.useEffect(() => {
7003 + const bar = {x: 2};
7004 + const baz = bar as typeof foo;
7005 + console.log(baz);
7006 + }, []);
7007 + }
7008 + `,
7009 + },
7010 ],
7011 invalid: [
7012 {
@@ -7016,6 +7040,40 @@ const testsTypescript = {
7040 },
7041 ],
7042 },
7043 + {
7044 + code: normalizeIndent`
7045 + function App() {
7046 + const foo = {x: 1};
7047 + const bar = {x: 2};
7048 + useEffect(() => {
7049 + const baz = bar as typeof foo;
7050 + console.log(baz);
7051 + }, []);
7052 + }
7053 + `,
7054 + errors: [
7055 + {
7056 + message:
7057 + "React Hook useEffect has a missing dependency: 'bar'. " +
7058 + 'Either include it or remove the dependency array.',
7059 + suggestions: [
7060 + {
7061 + desc: 'Update the dependencies array to be: [bar]',
7062 + output: normalizeIndent`
7063 + function App() {
7064 + const foo = {x: 1};
7065 + const bar = {x: 2};
7066 + useEffect(() => {
7067 + const baz = bar as typeof foo;
7068 + console.log(baz);
7069 + }, [bar]);
7070 + }
7071 + `,
7072 + },
7073 + ],
7074 + },
7075 + ],
7076 + },
7077 {
7078 code: normalizeIndent`
7079 function MyComponent() {
@@ -7217,6 +7275,76 @@ const testsTypescript = {
7275 },
7276 ],
7277 },
7278 + {
7279 + code: normalizeIndent`
7280 + function MyComponent() {
7281 + const [state, setState] = React.useState<number>(0);
7282 +
7283 + useEffect(() => {
7284 + const someNumber: typeof state = 2;
7285 + setState(prevState => prevState + someNumber + state);
7286 + }, [])
7287 + }
7288 + `,
7289 + errors: [
7290 + {
7291 + message:
7292 + "React Hook useEffect has a missing dependency: 'state'. " +
7293 + 'Either include it or remove the dependency array. ' +
7294 + `You can also do a functional update 'setState(s => ...)' ` +
7295 + `if you only need 'state' in the 'setState' call.`,
7296 + suggestions: [
7297 + {
7298 + desc: 'Update the dependencies array to be: [state]',
7299 + output: normalizeIndent`
7300 + function MyComponent() {
7301 + const [state, setState] = React.useState<number>(0);
7302 +
7303 + useEffect(() => {
7304 + const someNumber: typeof state = 2;
7305 + setState(prevState => prevState + someNumber + state);
7306 + }, [state])
7307 + }
7308 + `,
7309 + },
7310 + ],
7311 + },
7312 + ],
7313 + },
7314 + {
7315 + code: normalizeIndent`
7316 + function MyComponent() {
7317 + const [state, setState] = React.useState<number>(0);
7318 +
7319 + useMemo(() => {
7320 + const someNumber: typeof state = 2;
7321 + console.log(someNumber);
7322 + }, [state])
7323 + }
7324 + `,
7325 + errors: [
7326 + {
7327 + message:
7328 + "React Hook useMemo has an unnecessary dependency: 'state'. " +
7329 + 'Either exclude it or remove the dependency array.',
7330 + suggestions: [
7331 + {
7332 + desc: 'Update the dependencies array to be: []',
7333 + output: normalizeIndent`
7334 + function MyComponent() {
7335 + const [state, setState] = React.useState<number>(0);
7336 +
7337 + useMemo(() => {
7338 + const someNumber: typeof state = 2;
7339 + console.log(someNumber);
7340 + }, [])
7341 + }
7342 + `,
7343 + },
7344 + ],
7345 + },
7346 + ],
7347 + },
7348 ],
7349 };
7350
packages/eslint-plugin-react-hooks/src/ExhaustiveDeps.js
+4
@@ -543,6 +543,10 @@ export default {
543 });
544 }
545
546 + if (dependencyNode.parent.type === 'TSTypeQuery') {
547 + continue;
548 + }
549 +
550 const def = reference.resolved.defs[0];
551 if (def == null) {
552 continue;