Cmd+click of JSX component shows type definition in VSCode, instead of linking to component definition

As requested by @RyanCavanaugh on issue #24809 - reopening the issue with an updated concrete way to reproduce.

Tested with latest VSCode 1.43, latest typescript 3.8.3.

Simply create a .tsx file in VSCode with the following content:

import React from 'react'

const Thing: React.FC<{ text: string }> = (props) => <div>{props.text}</div>

const HelloWorld = () => <Thing text="hello world" />

And cmd+click on <Thing on line 5

Expected behavior:

Cursor moves to definition of const Thing on line 3.

Actual behavior:

VSCode opens a definitions window with links to 2 definitions:

1. The component definition on line 3 (that I expected to be linked to)
2. The definition for the type of the component: React.FC, in node_modules/@types/react.

---

This seems like a bug. In practice it means navigating is broken for JSX components, as cmd+clicking to link doesn’t work - you have to cmd+click then click on the code definition again in the definitions window.

I am pretty sure that in the vast, vast majority of cases, when people cmd+click on the JSX for a component, they want to link to the component’s definition and not the type.

Even supposing people did want to do that, in some cases:

1. Just seeing what the type is would be solved in one click, because it is there in the definition
2. Navigating to that type definition if you really wanted to would remain at 2 clicks - by just cmd+clicking it right there in the definition.

So, there seems no downside here. Improve (fix) the most common usecase, less common (if ever) usecase still works, still 2 clicks.

[sambecker]

Dealing with this all day long in a React TypeScript project. All components are typed React.FC and exported as default.

One fix that’s helped is changing Editor > Goto Location: Multiple Definitions from peek to goto in settings.

Obviously, this will end up concealing some secondary definitions that might actually be useful to know about but in the meantime it makes command-clicking components behave as I would expect it to.

[jodaka]

Same here. cmd+click suddenly started to throw me to the node_modules/@types/react/index.d.ts for any component with React.memo. Please, fix this, it’s an essential feature in vscode.

There’s a plugin that fixes that problem. No need to post countless “same here” comments.