Bug: react-hooks/exhaustive-deps false positive when deps is defined with typescript const typing

[tranvansang]

React version: 17.0.1

Steps To Reproduce

1. Setup eslint with @typescript-eslint/parser as parser
2. Add as const to the deps array

function MyComp() {
	const [state, setState] = useState()
	useEffect(() => {
		console.log(state)
	}, [state] as const)
	return 'Hello, world'
}

Link to code example: https://github.com/tranvansang/exhaustive-deps-bug-1

The current behavior

The following errors were reported

  5:5  warning  React Hook useEffect was passed a dependency list that is not an array literal. This means we can't statically verify whether you've passed the correct dependencies  react-hooks/exhaustive-deps
  5:5  warning  React Hook useEffect has a missing dependency: 'state'. Either include it or remove the dependency array  

The expected behavior

The rule should interpret the deps argument correctly.

_

Why do I need to add as const to the deps array?

I build my own custom effect hook (with the additionalHooks option in .eslintrc), in which a tuple typing gives more type hint to the code.

[forivall]

I'm having this issue too.

[eps1lon]

Thanks for the report.

Would you be willing to add a test to

react/packages/eslint-plugin-react-hooks/__tests__/ESLintRuleExhaustiveDeps-test.js

Line 7612 in bd25570

const testsTypescript = {

. Then one could pick up the work and fix the implementation.

[Emotico]

Hello, we are a group of researchers developing machine learning techniques to locate issues suitable for newcomers, and our model consider this issue as likely a "good first issue". May we recommend you to label it as "good first issue" so newcomers know where to choose?

Thank you!
@eps1lon