VS Code Swift Extension Project Panel

Hi all,

I’d like to pitch a change to the VS Code Swift Extension’s dependency panel, evolving it into more of a Project Panel that provides a higher level view of your project. Please let me know if you have any questions or thoughts!

Introduction/Motivation

Currently, access to your package targets, dependencies, commands and tasks are spread between the command palette and the dependencies panel. This makes it hard to tell at a glance all the targets, tasks and commands that are available. I’d like to provide a more centralized view of the targets and dependencies that make up your project.

Proposed Solution

The project panel would be a tree view with four top level nodes:

Dependencies

Currently the package dependencies panel is a tree view of dependencies which includes all dependencies-of-dependencies in a flat list. This makes it hard to tell what dependencies are defined by the user in the root Package.swift, and what dependencies are included transitively.

In the Project Panel the dependencies list would become hierarchal so the top level is a list of dependencies that you have defined in the Package.swift, and drilling down shows what dependencies are included by which parent. Dependencies would still have their filesystem contents listed under their tree node (not shown in the mockup screenshot).

The functionality to edit dependencies as well as trigger swift package resolve from the panel would stay unchanged.

Targets

Entries under the Targets top level node would enumerate the targets defined in your Package.swift. Expanding an individual target would show:

  • A dependency list for dependencies of the target
  • A button to run/debug the target the target is executable
  • A button to run the target’s tests (if there are any test targets that include this target as a dependency)

Tasks

The tasks entry would show a list of both the synthesized tasks provided by the extension such as Build All, and any user defined tasks in their .vscode/tasks.json. The goal is to make it easier for users to build and debug with their custom tasks.

Commands

If your package or a dependency defines any runnable commands they would appear under the commands list. This would essentially be a mirror of the list in > Swift: Run Command Plugin , and would allow command plugins to be run directly from the panel.

These changes wouldn't necessarily need to land all at once; they could be staged as incremental changes to the existing Project Dependencies panel, first building out the "dependencies" tree node and then adding on targets, tasks and commands.

This is a high level view of where I'd like to take things, please let me know if you have any use cases or improvements you'd like to see.

11 Likes

In general I love it!

I don't know if we should use the dependency as the indicating factor if the tests belong to that target. It might just be a side import that you need for testing a different target. What about using target names as the first approximation e.g. FooModule runs FooModuleTests if they exists and falling back to yours.

Is there by default a Run all tests task as well?

One additional thing, the order in your screenshot doesn't fit with what my priority list would be. I personally would like to see Tasks first, then probably Commands and then Targets, followed by Dependencies. Just from experience with how often I interact with each of them.

What about using target names as the first approximation e.g. FooModule runs FooModuleTests if they exists and falling back to yours.

I think this is a better way to do it, I'll make a note. Thanks!

Is there by default a Run all tests task as well?

The extension synthesizes some tasks such as Build All, I think Test All would make sense to add as well.

One additional thing, the order in your screenshot doesn't fit with what my priority list would be

I'm happy to adjust the default order. One thing I didn't touch on was the ability to drag/drop the top level nodes to rearrange their default order, which should be possible with Test tree drag and drop API · Issue #145577 · microsoft/vscode · GitHub

Thanks for the great feedback!

1 Like

Yeah I agree in general it does sound good.

Do you have enough information to do this? Are you planning on parsing the Package.swift files.

Given you are also showing the test target, do you need to add a run tests entry for the non-test targets. In the end your guess on which tests to run will never be 100% correct and cause confusion.

A build target button would be good.

In the test explorer you can press the button at the top to run all tests

Unfortunately my priorities would be the exact opposite. Building and running of targets are available in other UIs. So have less priority here, but this is the only place to view the package dependencies.

Currently the flat list of dependencies is being loaded by reading ./.build/workspace-state.json.
I believe we can get the graph using swift package show-dependencies --format json, though this is potentially slow because it requires a package resolution.

To mitigate this slowness we can get all top level dependencies quickly with swift package describe --type json, which doesn't require a resolution, and then run show-dependencies in the background and lazily show the tree node children on request.

Given you are also showing the test target, do you need to add a run tests entry for the non-test targets

Thinking about this more you're probably right; its only made clear by naming convention what targets are exercised by what test targets and so wouldn't be easy to tell at a glance what tests would run when clicking "Run Tests" on a target. Easier to limit this functionality to test targets only.

The other option is to leave the dependencies view as is and add a new panel for a package overview which include targets, tasks etc