TreeDataProvider: allow selecting a TreeItem without affecting its collapsibleState

Question

TreeDataProvider: allow selecting a TreeItem without affecting its collapsibleState

patrys opened this issue 7 years ago · 31 comments

Currently clicking an item will both select it and change its expanded/collapsed state. This results in very weird UX as you need to click the items to interact with them.

I have an extension that provides a tree outline of the currently opened file and clicking a class name will currently select that class in the editor and at the same time expand/collapse its children in the tree view.

Related: patrys/vscode-code-outline#24

Answer 1 · 2017-09-11T14:41:36.000Z

Somewhat related to #28632

Answer 2 · 2017-11-29T23:18:29.000Z

I'm bumping the severity of this since it makes the tree very difficult to use for users.

Answer 3 · 2017-12-01T13:48:08.000Z

@weinand May I know the explanation behind its importance?

@patrys @eamodio May I know your expectation in this case. Is your request is to support command only for leaf items?

Answer 4 · 2017-12-01T14:41:55.000Z

Today I learned that all VS Code trees behave like this.

So all VS Code trees collapse/expand when a node is selected.
For the standard VS Code trees (e.g file explorer) this is not a problem because the only purpose of selecting a non-leaf node is to expand or collapse it, so selecting a non-leaf node is not really needed because the node itself is never fed into an editor.

For custom trees the story is not so clear:
In a custom tree a non-leaf node might feed into an editor and expanding its children could be an expensive operation. So it is questionable whether both purposes should be coupled into one gesture.
If a user only wants to select the node in order to open it in an editor, this is not possible without expanding all children at the same time.

Since the current behaviour is consistent with the other VS Code trees, I think this is not a bug but a feature and we can remove the "important" flag (and there is no need to implement this feature in this milestone).

Answer 5 · 2017-12-01T15:28:46.000Z

@sandy081 My extension shows a code outline so containers can be classes while leaves are functions, I'd very much like to support commands at all tree levels in a way that does not affect the tree state.

Answer 6 · 2017-12-01T17:11:20.000Z

For me, it is less about the user clicking on an item, and more about having an api (way) to not only set focus to the tree, but select an item -- and ideally control whether or not it expands when selected via that api.

Answer 7 · 2017-12-01T18:59:59.000Z

@eamodio this is a different issue. You are asking for new API which is already covered by #30288.

Answer 8 · 2017-12-01T19:15:06.000Z

@weinand very true -- I had originally wanted something like this (where the user controlled it -- I opened #28632), but while I still think it could be useful (for example in GitLens, there are nodes in the tree that both have children and could support a click command themselves) I am worried about the user experience of it. Unless the whole tree behaves the same way, I think it would be strange for a user, if sometimes clicking on a node would expand it and sometimes it might execute a command. Anyway my 2c :)

Answer 9 · 2017-12-01T22:30:50.000Z

I think it would be less surprising if the tree behaved more like native platform trees: usually clicking the name selects/activates items while clicking the chevron or pressing the left/right arrow key collapses/expands the tree.

Answer 10 · 2017-12-03T21:10:32.000Z

@eamodio I agree with your point about consistency. As mentioned, all tree in VS Code are now consistent in how to expand, collapse and selected. In order to separate commands from expand/collapse, how about exposing primary commands on nodes. Eg:

I would still allow command on selection which extension authors can decide to have or not to have on leaf nodes and parent nodes.

Answer 11 · 2017-12-04T12:51:21.000Z

@sandy081 How do you imagine this helping with a code outline type of extension?

Answer 12 · 2017-12-04T14:52:14.000Z

@patrys Agreed, it wont help such extensions. Unfortunately I have to be consistent with current tree behaviour in VS Code.

Answer 13 · 2018-01-06T06:27:12.000Z

Running into exactly same issue. Can you please prioritize the fix and allow extensions to override the behavior?

Answer 14 · 2018-03-22T15:12:35.000Z

This is somewhat blocking a feature for us too; I'm wondering if I can workaround it by forcing the tree to re-render and adding new items that are set to collapsed? (it would kinda suck though!)

Answer 15 · 2018-03-22T16:02:52.000Z

@DanTup Since I don't need the behavior for when the user clicks on an item, I've been waiting for #30288 so that I wouldn't have to play around with what you suggest -- force a re-render and change the collapsed state.

Answer 16 · 2018-03-22T16:30:04.000Z

@eamodio I was just playing with that in insiders (couldn't make it work though, it calls getParent until it gets to my root and I return null and then it crashes saying it can't resolve the tree item). I need that too (need to select outline nodes as the user moves around the editor), but it doesn't excuse this - the user clicking on the nodes causing collapses is super-wonky.

Answer 17 · 2018-04-27T12:30:44.000Z

This is super annoying, I've upvoted both this and #28632 (where the last comment is about awaiting feedback to justify it but three months in VSCodeBot closes down the conversation, oh, how I love VSCodeBot) but feel like I need to vouch for the importance of considering this with a comment, too! The UX on custom trees is extra trippy, certainly unpleasant and I wish it can be rectified.

Answer 18 · 2018-04-27T15:59:58.000Z

I wish I saw #28632 earlier as my extension is affected by it but I guess it could be seen as part of this issue (as there needs to be some folding mechanism).

Answer 19 · 2018-05-15T14:31:03.000Z

May I know every body asking for this requirement is for Outline views? Or is there some other type of custom view needed this? If so, can you please mention.

Thanks

Answer 20 · 2018-05-15T14:33:44.000Z

My VS Code extension MarkDown To-Do would benefit from this. I need to be able to let the user click a to-do item in my custom tree view to open the corresponding editor and line or let them expand subitems.

Answer 21 · 2018-05-15T15:30:57.000Z

@sandy081 Ours is an outline view, however it's kinda specialised (doesn't map directly onto Code like a normal outline, and we'd probably also have a standard outline) if that's relevant (eg., if you built in a standard outline view, I don't think that's solve the problem for us).

Answer 22 · 2018-06-06T06:42:08.000Z

Hopefully the capability to suppress collapse on click is built some day. VS code tree view extension feels so limited because of this issue :( !!!

Answer 23 · 2018-06-19T06:59:18.000Z

For me, it is less about the user clicking on an item, and more about having an api (way) to not only set focus to the tree, but select an item -- and ideally control whether or not it expands when selected via that api.

@eamodio I suppose your requirement mentioned here is supported now using the existing APIs

Answer 24 · 2018-06-19T07:06:14.000Z

Here are the two proposals I can think of as solution

Have a tree property like expandOrCollapseOnTwisty and let every node in the tree honours this.
If a tree node has a command, then Expand/Collapse it only when user clicks on twisty, otherwise do it when user clicks any where on the node.

Answer 25 · 2018-06-20T14:46:09.000Z

@sandy081 AFAIK there still isn't an api to select an item in the tree and have it expand or collapse though right?

With regards to the proposed, I like #2 -- implicit and imo will do what you want (even though the experience is inconsistent it could be desirable depending on the usage).

Answer 26 · 2018-06-20T15:00:23.000Z

@eamodio There is reveal API to select, but not to expand or collapse. Is there an issue you opened where we can discuss about it?

I also liked #2 and implemented.

If a node provides command, then node is expanded/collapsed only when user clicks on the twisty. Also, command will not be executed when user clicks on twisty.

Answer 27 · 2018-06-20T15:08:42.000Z

@sandy081 We talked about it back during the reveal api discussion, but I don't have a strong enough need for it at this point, so I'll leave it be ;)

Answer 28 · 2018-06-20T16:05:52.000Z

@eamodio I haven't tried it, but does changing collapsibleState and then fire an update for the node work? (it's not nice, sure, but if it works?)

Answer 29 · 2018-07-09T08:30:21.000Z

This has not shipped as a part of the June milestone, right? Can the milestone be updated to the next one in case this is projected to land in it?

Answer 30 · 2018-07-10T07:41:20.000Z

@TomasHubelbauer This is fixed in June milestone and is available in the latest 1.25 (June) stable release.

May I know why do you think so?

Answer 31 · 2018-07-10T18:01:01.000Z

I've also verified in latest version 1.25 and works beautifully!! Thanks for addressing it.