microsoft / vscode

Visual Studio Code
https://code.visualstudio.com
MIT License
164.39k stars 29.32k forks source link

Extensions view not consistent in how it displays local vs. remote installed #207724

Closed thernstig closed 6 months ago

thernstig commented 8 months ago

Type: Bug

This is a UX issue with how extensions are shown in the Extensions Side Bar. I will present a few inconsistencies found, that I believe warrants to be looked over. I consider it a bug as the information presented seems inconsistent and thus wrong in some sense.

The reason why I present this as one bug report and not multiple is that it feels like a UX/UI oversight that is better shown as a whole, to better visualize that the aggregation of these issues make the view cause more confusion than it should. I can break this down into separate issues if required.

Background

Workspace Extensions prefer to run where the workspace is located. When using remote development, this should be on the Remote Extension Host, see https://code.visualstudio.com/api/advanced-topics/remote-extensions.

In the Extensions Side Bar, the Extensions that prefer to run on the Remote Extension Host are presented both in the LOCAL - INSTALLED view, where they are greyed out, as well in the remote view seen as SSH: VM - INSTALLED in the picture. I will hereby refer to these as the "local view" and "remote view".

image

Problems

A list of findings are presented here.

Problem 1

Not all extensions that are installed and visible in the remote view are seen as greyed out in the local view. Why is the Go extension not visible and greyed out in the local view?

image

Problem 2

The local view sorts extensions in an alphabetical order, but sometimes it sorts them in a non-alphabetical order. This is an intermittent fault. Sorting them in alphabetical order is done in the majority of cases. Reloading the VS Code window can show this at times.

In the image in the Background chapter above you can see them in alphabetical order in the local view. In the image below you see the extensions that run on the local extension host at the top of the local view.

image

Problem 3

Uninstalling an extension from the local view (greyed out) by clicking it and selecting Uninstall (screenshot 1), then shows it being uninstalled both in the local view, remote view and in the extension info window itself (screenshot 2). But reloading VS Code then shows it in the local view, but not in the remote view. And in the extension window itself one is able to click Uninstall again (screenshot 3).

This makes no sense as it was uninstalled in screenshot 2. It should have been gone completely and screenshot 3 should never have shown it.

Screenshot 1 image

Screenshot 2 image

Screenshot 3 image

Problem 4

When using profiles, sometimes extensions are greyed out in the remote view, see screenshot for Azure Account. Notice also how the extension info window itself does not mention anything on where it is installed. This shows up like this even if "Apply Extension to All Profiles" have been selected. It is greyed out since it is disabled.

But this means that greyed out have various meanings in the local and remote view. I.e. as seen in previous problems above, greyed out in the local view means it is installed in the remote extension host. But here it means it is disabled completely.

I am not sure what to take of this, as the whole thing is just "werid" for lack of better words. I am not sure what to expect in regards to "Apply Extension to all Profiles".

image

Problem 5

This is an UX issue, and here opinions might differ. But why is remote installed extensions even listed as greyed out in the local window?

The local window says LOCAL - INSTALLED. Even though the local view has them greyed out, and adds an icon indicating they are installed remotely, just reading LOCAL - INSTALLED and then seeing remote extensions there is confusing for some users.

I do not know the best approach to solve this. Maybe just showing them in the remote view. Or some other solution.

Problem 6

The text This extension is enabled globally. is not easy to understand. https://code.visualstudio.com/docs/editor/extension-marketplace#_disable-an-extension mentions this as the opposite of workspace extensions. Why not instead say "This extension is enabled in all workspaces" or "This extension is enabled globally (in all workspaces)"?

Reference to other issues

There are other issues that all in total retracts from the Extensions view experience: https://github.com/microsoft/vscode/issues/207712 https://github.com/microsoft/vscode/issues/196351 https://github.com/microsoft/vscode/issues/190992

VS Code version: Code 1.87.2 (863d2581ecda6849923a2118d93a088b0745d9d6, 2024-03-08T15:20:17.278Z) OS version: Windows_NT x64 10.0.19045 Modes: Remote OS version: Linux x64 5.4.0-173-generic

System Info |Item|Value| |---|---| |CPUs|12th Gen Intel(R) Core(TM) i5-1245U (12 x 2496)| |GPU Status|2d_canvas: enabled
canvas_oop_rasterization: enabled_on
direct_rendering_display_compositor: disabled_off_ok
gpu_compositing: enabled
multiple_raster_threads: enabled_on
opengl: enabled_on
rasterization: enabled
raw_draw: disabled_off_ok
skia_graphite: disabled_off
video_decode: enabled
video_encode: enabled
vulkan: disabled_off
webgl: enabled
webgl2: enabled
webgpu: enabled| |Load (avg)|undefined| |Memory (System)|31.64GB (18.28GB free)| |Process Argv|--crash-reporter-id 59df0552-792a-4e7c-92f1-327caa3dd76d| |Screen Reader|no| |VM|0%| |Item|Value| |---|---| |Remote|SSH: vm| |OS|Linux x64 5.4.0-173-generic| |CPUs|Intel(R) Xeon(R) Gold 6148 CPU @ 2.40GHz (8 x 2394)| |Memory (System)|31.32GB (27.86GB free)| |VM|100%|
Extensions (32) Extension|Author (truncated)|Version ---|---|--- yang|mar|0.1.3 jupyter-keymap|ms-|1.1.2 remote-containers|ms-|0.348.0 remote-ssh|ms-|0.109.0 remote-ssh-edit|ms-|0.86.0 remote-wsl|ms-|0.86.0 vscode-remote-extensionpack|ms-|0.25.0 remote-explorer|ms-|0.4.3 remote-server|ms-|1.5.1 vscode-openapi|42C|4.25.1 vscode-fish|bma|1.0.38 ruff|cha|2024.16.0 vale-vscode|chr|0.18.5 vscode-markdownlint|Dav|0.54.0 gitlens|eam|14.9.0 prettier-vscode|esb|10.1.0 code-runner|for|0.12.1 go|gol|0.41.1 restructuredtext|lex|189.3.0 direnv|mkh|0.17.0 vscode-azureresourcegroups|ms-|0.8.4 vscode-cosmosdb|ms-|0.20.1 vscode-docker|ms-|1.29.0 vscode-kubernetes-tools|ms-|1.3.15 python|ms-|2024.2.1 azure-account|ms-|0.11.6 vscode-yaml|red|1.14.0 code-spell-checker|str|3.0.1 even-better-toml|tam|0.19.2 shellcheck|tim|0.37.0 simple-rst|tro|1.5.4 vscode-proto3|zxh|0.5.5
A/B Experiments ``` vsliv368:30146709 vspor879:30202332 vspor708:30202333 vspor363:30204092 vstes627:30244334 vscorecescf:30445987 vscod805:30301674 binariesv615:30325510 vsaa593:30376534 py29gd2263:30899288 vscaat:30438848 c4g48928:30535728 azure-dev_surveyonecf:30548226 962ge761:30959799 pythongtdpath:30769146 welcomedialog:30910333 pythonidxpt:30866567 pythonnoceb:30805159 asynctok:30898717 pythontestfixt:30902429 pythonregdiag2:30936856 pyreplss1:30897532 pythonmypyd1:30879173 pythoncet0:30885854 h48ei257:30986171 pythontbext0:30879054 accentitlementsc:30887149 dsvsc016:30899300 dsvsc017:30899301 dsvsc018:30899302 pydisww1:30981707 cppperfcontrol:30979541 8082a590:30971561 fegfb526:30981948 bg6jg535:30979843 ccp2r3:30958157 dsvsc020:30976470 7ghi1836:30988842 ```
sandy081 commented 7 months ago

Problem 1: Why is the Go extension not visible and greyed out in the local view?

It is obvious that extension is not installed locally and it is not visible there.

Problem 2: The local view sorts extensions in an alphabetical order, but sometimes it sorts them in a non-alphabetical order. This is an intermittent fault. Sorting them in alphabetical order is done in the majority of cases. Reloading the VS Code window can show this at times.

Default sorting puts active extensions on the top. Active extensions are those which are enabled/running.

Problem 3: Uninstalling an extension from the local view (greyed out) by clicking it and selecting Uninstall (screenshot 1), then shows it being uninstalled both in the local view, remote view and in the extension info window itself (screenshot 2). But reloading VS Code then shows it in the local view, but not in the remote view. And in the extension window itself one is able to click Uninstall again (screenshot 3).

I can see the confusion here. Opening an extension always opens the active one. In this case the extension on the remote one was opened. But I agree it should open the extension that user clicks on. Can you please file a separate issue for this so that we can track this separately.

Problem 4

It is unclear to me what the problem is. It would be great if you can elaborate more on that. Again, I recommend to create a separate issue for this so that we can track them separately which makes it easier.

Problem 5: But why is remote installed extensions even listed as greyed out in the local window?

It is because, they are also installed locally. It is important to the user to show what extensions are installed locally and remotely.

Problem 6:

Valid point, we can simply remote that text as it is obvious. Also recommended to file a separate issue.

vscodenpa commented 6 months ago

This issue has been closed automatically because it needs more information and has not had recent activity. See also our issue reporting guidelines.

Happy Coding!

thernstig commented 6 months ago

@sandy081 apologize for the late reply. I appreciate your replies very much.

I believe I am onto something in some of these cases. I will try to add some clarifications here in case it helps you understand each issue better. Eventually I do plan to write separate issues. My motiviation with all of this is of course good. I want to improve the situation UX for all users.

  1. I see your point. Though I am not sure this obvious and good UX. If I search and install an extension it only has an in install button. Example: image I cannot decide to install it locally or remotely. It installs in both and then enables itself remotely. This is exactly what I did for the Go extension, so then it should have shown up in the local view as well. It is possible this is tied into issue 2), as that is a bug.

  2. Can you re-read this problem text? I am saying that if I reload VS Code, it sometimes sorts in alphabetical order and sometimes in non-alphabetical. I do nothing else but to reload using the "Developer: Reload Window" command. It is intermittenly sorting in different ways each time I reload the VS Code window.

  3. https://github.com/microsoft/vscode/issues/211446

  4. I can see this was confusing. What I am after is that greyed out means it is disabled. But there are two kinds of disabled. Either automatically by VS Code. A case is where it is installed both locally and remotely, but prefers to run remotely. Then it is disabled locally automatically. But if I right-click and select "Disable", it also just shows as greyed. I wish the extension actually had an icon or indication if I manually disabled an extension: Because this means I have to take action to enabled it again.

  5. Understood, I have no better proposal here myself.

  6. https://github.com/microsoft/vscode/issues/211450

sandy081 commented 6 months ago
  1. I cannot decide to install it locally or remotely

It is difficult for the user to install an extension on a correct location as it needs lot of internal knowledge. Hence VS Code does it automatically for users.

Problem 2

Can you please provide steps to reproduce

Problem 4

I understand your point. There is no visual indicator but we provide information on hover. I am not sure how much worth it is to show the information directly vs having minimal UI.

thernstig commented 6 months ago

@sandy081

  1. Does VS Code not by default install both locally and remotely when pressing Install? What I think I have seen is that I clicked Install and it installs both locally and remotely, but is disabled locally. But sometimes it just installed on the remote (and enabled there). I think we can park this quesiton though, as I am unsure now and need to come back to this in the future in a separate issue if I see this again.

  2. Press ctrl+shift+p and select Developer: Reload Window when you have local and remote extensions installed. Notice how the sorting order of the extensions can be different between reloads. Do it a few times to make sure. The original post shows this. Compare the screenshots to see the different sorting when I took the screenshot at different times after having reloaded. Sometimes it is in alphabetical order, without me clicking/changing any sorting order.

  3. Fair point. I think it would be valuable to know which ones I have disabled myself, in case I forget and want to enable them again. But it might be superfluous.