What is the name of the capability in VS Code where you can hover over a variable and see where it's defined?

Viewed 1262

When you hover over a variable in VS Code, e.g., a function name, there's a small pop up that shows where the function is defined and some other quick details. What is the name of this feature?

I'm setting up VS Code on a new computer, and I'm trying to get that feature, but not sure what it's called.

1 Answers

The built-in feature is aptly referred to as hover or hovers.

For example, the docs for the built-in Go to Definition mentions it as:

If you press Ctrl and hover over a symbol, a preview of the declaration will appear

It is also mentioned in various language-specific features, such as this one for HTML Hover:

Hover

Move the mouse over HTML tags or embedded styles and JavaScript to get more information on the symbol under the cursor.

HTML Hover

The relevant built-in settings are grouped by *.hover.*, such as:

// Prefer showing hovers above the line, if there's space.
"editor.hover.above": true,

// Controls the delay in milliseconds after which the hover is shown.
"editor.hover.delay": 300,

// Controls whether the hover is shown.
"editor.hover.enabled": true,

...

// Show tag and attribute documentation in hover.
"html.hover.documentation": true,

// Show references to MDN in hover.
"html.hover.references": true,

...

The contents however depend on the language of the file (as indicated on the status bar on the lower right of VS Code) and/or the extensions you have installed. For example, you said "shows where the function is defined", but for my Python workspaces, they typically just show the function signature and documentation:

sample hover popup for Python

So you would have to check both the built-in settings and the extension settings if you are looking for specific behavior/contents of the hover popup.

The way for extensions to modify the hover behavior/contents is also referred to as Show Hovers, and so it makes sense for extension-specific settings to refer to it as hover as well:

Show Hovers

Hovers show information about the symbol/object that's below the mouse cursor. This is usually the type of the symbol and a description.

animation of Show Hovers, taken from the VS Code docs

Related