Feature request: symbols tree view

boyvinall commented 8 years ago

VSCode very quickly got to nearly being my default editor. One thing I'm missing is something like https://atom.io/packages/symbols-tree-view where I can view the structure of a file whilst editing. I've used this view across many editors for years.

Yanpas commented 6 years ago

I've created an issue here for tree-like symbols https://github.com/Microsoft/language-server-protocol/issues/327

xueyunquan commented 6 years ago

@patrys Thanks for your reply. I am using 0.0.12, actually. When I switching to another file, especially those not opened recently, it always takes 2~5 seconds to update the outline view.

And as @Yanpas has stated, it does not show a tree structure for C++, as well as C that I use most often. But of course this issue comes from the parser, here both provided by the cpptools plugin developed by MS.

derme302 commented 6 years ago

+1

ozum commented 6 years ago

I appreciate hardwork of @patrys (https://marketplace.visualstudio.com/items?itemName=patrys.vscode-code-outline) and I'm grateful. However I think this should be a native feature of editor.

I use Nuclide (Atom) for flow and VSCode for Typescript. I find Nuclide's Outline and Context view very useful and polished. I wish everyday VSCode has those as a native feature.

screen shot 2017-12-13 at 08 53 52

VenPot commented 6 years ago

When is code outline coming out of the box natively? Vs code is the most loved editor now and not having this feature is a bummer.

ViggoV commented 6 years ago

It would be awesome if symbols were marked on the minimap, for example with a colored bar or fitting icons. Then hover to see details and click to go to symbol.. Alternatively the files in the treeview could be expanded further to reveal symbols. Just brainstorming :)

saighost commented 6 years ago

Maybe I can add a switch action for minimap to show the tree, but I prefer a new outline view.

ArkadiuszMichalski commented 6 years ago

This is core function for every real editor, VSC should have it. Some basic built-in panel would be indicated, but making a good API for this could result in the creation of great plugins.

This really looks great: https://github.com/Microsoft/vscode/issues/5605#issuecomment-351291978

Notepad++ has built-in function list: https://notepad-plus-plus.org/features/function-list.html but I prefer SourceCookifier: http://sourcecookifier.sourceforge.net/

Basic future should be:

separate panel for list (not use existing Explorer panel - there are too many things there)
search box
working with single file/all open file/all project file (with the possibility of quick change)
customizable appearance and parsing rules
supports custom languages

LeThiHyVong commented 6 years ago

@ArkadiuszMichalski Thank for great ideas. However, I have some additional thoughts. In fact, Ctrl+Shift+O, Ctrl+T and Navigation Pane currently work like a function list in single file/whole project (including search box , too) that can satisfy your first three suggested features in some way. There are already some extension out there (Code outline or Show functions). I think the symbol tree view can also:

Highlight the currently selected symbol(s) and all symbols that match/contain the search keyword (by Ctrl+F).
Display the simplified code structure (especially big switch-case and condition expression).

NaGeL182 commented 6 years ago

Any ETA when we could expect this feature or API?

jens1o commented 6 years ago

@NaGeL182 Feel free to do a pr, of course, then it would go to 1.21 ;)

johnnymast commented 6 years ago

I would love to see this feature added.

nmaxcom commented 6 years ago

This was proposed about two years ago and apparently had great reception. I was wondering if it's not been classified as a priority (and why) or if I'm just dumb and I can't find it in the docs.

jens1o commented 6 years ago

This was proposed about two years ago and apparently had great reception. I was wondering if it's not been classified as a priority (and why) or if I'm just dumb and I can't find it in the docs.

Think of how long multi-root support has needed to wait ;)

nmaxcom commented 6 years ago

Think of how long multi-root support has needed to wait ;)

Excuse my ignorance, I'm a bit out of touch with the internals of Code. You mean this hasn't been developed for not having multi-root (different projects/folders at once?) support?

jens1o commented 6 years ago

You mean this hasn't been developed for not having multi-root (different projects/folders at once?) support?

no no no... I mean like the feature request for multi-root-support is older than this one and it has been a longer time until that request was implemented.

byron21 commented 6 years ago

Geany editor has also a very nice implementation of functions overview. I am attaching a screenshot for reference screenshot from 2018-03-13 13-21-44

nmaxcom commented 6 years ago

@byron21 I'm not sure that's better than other examples in this thread. It looks primitive and doesn't seem to make use of slightly different icons to help give more information. What are the numbers within the square brackets?

byron21 commented 6 years ago

The numbers within the square brackets indicate the function declaration line number. I agree with you it looks primitive.

nmaxcom commented 6 years ago

I think we should squeeze as much relevant info as possible, preferably in an optional fashion and functionality.

For example:

show number of lines in that function or piece of code (good way to know where to trim fat or refactor)
different sorting ways: alphabetic, position in the code, number of lines, by type (function, class etc.), number of TODO's...
select one or more items and be able to reorder them and maybe even drag and drop through to other documents (simpler code cut and paste)
a small green dot or similar to indicate not staged/committed code.

I'll stop saying things or I'll just start repeating what others have said,

ljw1004 commented 6 years ago

@dbaeumer will you want this to be a request from the client or a notification from the server or both? Tree-view and Error-panel are the only pieces of always-visible UI in LSP.

We run into problems with Atom+Hack because Atom requests the outline view immediately, but the Hack LSP server declines the request during its first 30-60 seconds of initialization, and there's no good way for Atom to know when it should re-issue the request.

laughedelic commented 6 years ago

Hack LSP server declines the request during its first 30-60 seconds of initialization, and there's no good way for Atom to know when it should re-issue the request.

If the Hack LS cannot response on this type of request after initialization, it shouldn't claim so (i.e. register this capability) and use dynamic capabilities registration instead. Although I'm not sure it is supported by Atom yet, but it's a matter of time.

ljw1004 commented 6 years ago

@laughedelic Does that amount to saying that the standard error code ServerNotInitialized shouldn't be used?

laughedelic commented 6 years ago

@ljw1004 I'm not sure I understand it. From the LSP spec:

Until the server has responded to the initialize request with an InitializeResult, the client must not send any additional requests or notifications to the server.

What I see in Atom is a spinning progress indicator in the outline panel while server is initializing. Once it's ready the client sends the outline request (not before that), gets a response and shows it in the panel.

Legends commented 6 years ago

This is a must have...

ChickJ commented 6 years ago

I'm probably moving against the tide here, I do not think this is a good feature request. Why?

One of the reasons I switched to VSCode was its light nature. Feature creep will turn a good editor into another IDE. If those other editors are so great, e.g. Eclipse, why not use that editor? Oh yeah, that's right, people don't use those because they buckle under their own weight.

Legends commented 6 years ago

I think this should be part of VsCode core or at least as an extension...

jens1o commented 6 years ago

or at least as an extension...

There is one: https://marketplace.visualstudio.com/items?itemName=patrys.vscode-code-outline

Legends commented 6 years ago

@jens1o It says:

JavaScript | Comes with VS Code

You mean ctrl+shift+o ? I don't like it....

jens1o commented 6 years ago

No, please read the description. It only says the extension does not depend on external extensions so it can gather all symbols. It basically reads out the data that the language servers are giving.

Just try it out.

Legends commented 6 years ago

It's not perfect, but it helps. Perhaps it would be nice to have it as a pane on the right/left side. Otherwise you have to fadein the project explorer and then fadeout the "code outline", everytime you want to look for a function. A bit cumbersome...

ffimnsr commented 6 years ago

I think this would be better an option for users or just a plugin, the editor would be bloated if you added this kind of feature. There is visual studio if you need full pledge IDE though... Probably I need to transfer back now to Emacs or Vim as it is more lightweight.

ljw1004 commented 6 years ago

@laughedelic Thanks for the clarification. I hadn't been thinking right about this.

granteagon commented 6 years ago

I would like to have the symbols in place of the minimap. I frequently view multiple files in splits and being able to see the symbols for those files at the same time would be great.

seamlik commented 6 years ago

Actually I prefer something like "go to anything" where you type something (can be a symbol, a file or any command) and it aggregates all results in a single place.

Just like IntelliJ's tapping Shift twice.

jens1o commented 6 years ago

One :+1: missing!

(sorry 4 spam bros)

boyvinall commented 6 years ago

FYI, the latest release (0.2.0) of https://marketplace.visualstudio.com/items?itemName=patrys.vscode-code-outline does a great job with this now. It doesn't implement everything in the screenshots above but I find it quite usable. I'm using with golang, I guess YMMV.

milesj commented 6 years ago

The extension works great, but the fact that it can't be moved to the rigth column is an immediate no go for me (and probably most people).

onetrev commented 6 years ago

One option though is to move the entire Workbench to the right like so: "workbench.sideBar.location": "right"

Which is probably a good idea regardless if your first language reads L->R as then the brain naturally reads that way and thus your most important stuff (your code!) is first thing on the left side of the screen. It takes getting used to just because it's a change though.

jfcarr commented 6 years ago

Tried vscode-code-outline: Not bad at all!

fractalspace commented 6 years ago

Tried 'patrys.vscode-code-outline'. Didn't work for me at all. Always shows empty box (tried refresh, re-install etc). That, and also, I wanted to see it on the right. It is very disturbing to see where it shows up now.

gulshan commented 6 years ago

Hopefully being implemented this month. It's a planned item! #49327

Brent-Knigge commented 6 years ago

patrys.vscode-code-outline worked great for me, but for about a week now it has disappeared and no matter what I do, I can't seem to get it back...

dtromans commented 6 years ago

@Brent-Knigge It now has a separate panel. On the left you should see a new icon below which is for the code-outline view.

Brent-Knigge commented 6 years ago

@faintsignal thanks. I see it plain as day now - don't know why I didn't see it before. But then again, I'm like that when I open the fridge...

BuckyLuis commented 6 years ago

@faintsignal anyway to change it back into the explorer view? that activity bar takes up too much horizontal space >,>

Edit: i found it out https://github.com/patrys/vscode-code-outline/issues/120

open package.json of the extension and change
"views": {
"outline": [
{
"id": "symbolOutline",
in
"views": {
"explorer": [
{
"id": "symbolOutline",
this worked for me

jrieken commented 6 years ago

Good news: I have merged https://github.com/Microsoft/vscode/pull/49917 which means next insiders will ship with an outline. It is a preview, not yet finished and not yet enabled by default.

How to enable the outline preview?

All you need to do is select 'Outline' in the explorer view context menu:

Note that there are many ideas and expectations where to show the outline view. We started by thinking about what to show and because of that the outline view currently sits in the explorer view. Alternative locations are being discussed here: https://github.com/Microsoft/vscode/issues/49923 and as usually everyone is invited to join the discussion.

What does it already do?

The outline is far from finished but these are the features we support in the first round:

Show the symbol structure of the currently active editor
Show label, icon, and the default open gestures: (1) single click to reveal, (2) double click to reveal and focus, (3) alt+click to reveal to the side, (4) alt+double click to reveal and focus to the side, (5) enter to reveal and focus a symbol.
Sorting symbols: (1) by the position the document, (2) the name, and (3) their type
A 'follow cursor' feature which reveals the symbol matching the current editor selection
An unbound command outline.focus (you need to define your own keybinding for now) that moves focus to the outline
Support type to filter - it will hide items that don't match and pre-select the best match

What's next?

We have read through the comments here and looked at other outline implementation. We track further work with the outline-label (https://github.com/Microsoft/vscode/labels/outline) and we invite everyone to join the discussion. We expect to get closer to done, done in June - it'll be June because I'll be OOO for the rest of May.

ringods commented 6 years ago

@jrieken will this outline view be a generic view that other language plugins could build upon?

jrieken commented 6 years ago

The data it shows comes from extensions - it currently uses the DocumentSymbolProviders for that and there is an issue to better support document symbol hierarchies: #34968. So, that data defines what we show and while we don't expose our UX/view models to extensions there are ideas allowing to add commands, e.g allow for contributable context menu commands, see #49925

DanTup commented 6 years ago

@jrieken This looks great! But for those of us that need custom outlines, are all the APIs used by this exposed to us for use in our own tree?

microsoft / vscode

Feature request: symbols tree view #5605