Tree view panel for browsing and running tasks. Displays tasks from workspace and task files in an organized, customizable tree structure.
This extension is useful if:
- You integrate custom scripts/tools and want quick access to run and manage them
- You want to customize the task list for your specific workflow
- You have many tasks and need structure to navigate them
- You maintain a large task file and edit it manually
This extension won't help much if:
- You only use auto-detected tasks as-is — their providers likely offer dedicated panels already
- You don't have a
tasks.jsonfile and don't plan to create one - You prefer keyboard-driven workflow over panel-based UI
Organization
- Tasks grouped by workspace folder
- Optional tree hierarchy by splitting labels into path segments, and/or grouping by
groupproperty - Order matches task file — reorder tasks in file to reorder in tree
Filtering
- Option to exclude:
- Specific workspace folders
- Workspace-scope tasks
- Individual tasks via
hidefield
Display
- Respects task
icondefinition (id, color) detailrendered as markdown on hover- Visual status indicators (badge) for running tasks
Actions
- Open or create task file in editor
- Run, abort, access task terminal from context menu
- Jump to task definition in source file
Validation
- Duplicate labels and missing dependencies reported as problems
-
Only tasks with explicit
labelproperty appear. Provider-detected tasks without an explicit label property are not shown:Result: only tasks with labels appear. The unlabeled
npm: testtask is not shown. -
Global tasks (user-level
tasks.json) are not shown — currently limited to workspace tasks.
Composite task status: A task's running status badge only appears while its own command is executing — not during the dependsOn phase. For purely composite tasks (no command), this means no status badge will appear at all. Dependencies show their own status normally.
Workspace-level task validation: Validation does not yet cover tasks defined in .code-workspace files.
VS Code Marketplace: Search for @id:papio-dev.task-cockpit in Extensions View.
Open VSX: open-vsx.org/extension/papio-dev/task-cockpit.
Manual (VSIX): Download from GitHub Releases.
- Open the Task Cockpit panel in the Activity Bar
- Your tasks appear in the tree
- Hover a task to reveal the Run Task button; right-click for more options
- Access workspace settings via More Actions (⋯) in the panel header
Tip
Drag the panel closer to the terminal area if that suits your workflow better.
Tip
Set up keyboard shortcuts for frequently used actions — see Custom Shortcuts.
All settings are available under taskCockpit.* in VS Code settings.
Display and Filtering settings are resource-scoped — in multi-root workspaces each folder can have its own configuration. Quick access to these settings is available via panel menu (⋯).
Configure visual appearance and hierarchy structure in the task explorer.
Character for splitting task labels into hierarchical segments.
See also
taskCockpit.display.useGroupKind— grouping bygroupfield, without renaming tasks.
Must be a single non-alphanumeric, non-whitespace character or empty to disable hierarchy (default: empty).
For example, : organizes build:dev:watch into a tree: build → dev → watch.
Important
This setting only affects the tree display — tasks are still identified by their full label ("build:dev:watch", not "watch").
Intermediate nodes are implicit. Mentioning build:dev:watch creates the full path — no need to define build or build:dev as separate tasks. They become group nodes automatically.
A task doesn't have to be a leaf node — it can contain child tasks. Useful, for example, for visually grouping dependencies of a compound task:
Hierarchy comes from segments only. The order of tasks in the file doesn't affect nesting — a:b and a:b:c always produce a → b → c, regardless of which appears first.
Vertical position comes from the file. A branch appears at the position of its earliest occurrence. Tasks at the same level preserve their file order.
Hidden tasks ("hide": true) are removed from the tree.
Important
The separator is ignored at the start/end of labels, in consecutive occurrences, or when adjacent to whitespace. This allows using separator characters in natural contexts:
Scripts:npm: installwith:separator:Scripts→npm: install(whitespace near:)Compile/make in out/with/separator:Compile→make in out/(trailing slash ignored)
Groups tasks by their group property.
Tasks with a group property are placed under a folder named after their group. For example, tasks with group: "build" or group: { kind: "build" } appear under a Build folder (the group name will be capitalized).
Works independently or combined with taskCockpit.display.segmentSeparator.
Important
When combined, both grouping and splitting apply: a task named Build:dev:watch with group: "build" and separator : creates Build → Build → dev → watch, which is probably not what you intended.
Remove the redundant prefix from the task label, or disable one of the settings to avoid duplicate nesting.
Show folder icons for intermediate tree nodes.
Icon name for tasks without a custom icon in their definition. Defaults to tools.
Note
Tasks support a custom icon property (id and color). Task Cockpit respects these definitions.
Tip
To hide a task's icon, use blank as the icon name — it renders as an empty space.
Apply the task icon color to the task label text as well.
Control which tasks and workspace folders are visible in the task explorer.
showHidden
Show tasks marked with hide: true.
Exclude workspace folders from the task explorer.
Matches folder display names as shown by VS Code — if a folder has a custom name in .code-workspace, use that name, not the directory name. The workspace scope can be excluded the same way, using its name as it appears in VS Code (e.g. "something (Workspace)").
Example: ["my-project (Workspace)", "tests", "docs"]
(Has no effect in single-folder workspaces)
Deprecated. Use taskCockpit.filtering.excludeFolders instead.
Enable diagnostics to detect potential issues with task definitions.
Note
Validation runs when VS Code rebuilds the task list (e.g., after saving the task file or changing settings) — not in real time while editing.
Flag tasks with duplicate labels. Helps avoid unexpected behavior when running tasks with identical names.
(Experimental) Flag missing dependsOn references (default: false).
The extension doesn't define default keybindings.
To add your own, open Keyboard Shortcuts (Ctrl+K Ctrl+S) and search for Task Cockpit. Or use this example as a starting point for your keybindings.json:
{ // Toggle panel visibility
"key": "ctrl+shift+t",
"command": "task-cockpit-view.toggleVisibility"
},
{ // Focus the panel
"key": "ctrl+alt+t",
"command": "task-cockpit-view.focus"
},
{ // Refresh task list
"key": "ctrl+r",
"command": "task-cockpit.view.refresh",
"when": "focusedView == 'task-cockpit-view'"
},
{ // Run task (or start new instance if already running)
"key": "ctrl+enter",
"command": "task-cockpit.task.execute",
"when": "focusedView == 'task-cockpit-view'"
},
{ // Stop all running instances of a task
"key": "ctrl+shift+c",
"command": "task-cockpit.task.abort-all",
"when": "focusedView == 'task-cockpit-view'"
},
{ // Show terminal for running task
"key": "ctrl+t",
"command": "task-cockpit.task.show-terminal",
"when": "focusedView == 'task-cockpit-view'"
},
{ // Jump to task definition in source file
"key": "ctrl+e",
"command": "task-cockpit.tasks-file.open-task",
"when": "focusedView == 'task-cockpit-view'"
},
{ // Open tasks file for the selected item's scope
"key": "ctrl+o",
"command": "task-cockpit.tasks-file.open-file",
"when": "focusedView == 'task-cockpit-view'"
}The focusedView condition ensures shortcuts only work when the Task Cockpit panel has focus.
If you find Task Cockpit useful:
- Rate it on the VS Code Marketplace or Open VSX
- Report issues and share ideas on GitHub Issues
- Support financially — currently more helpful than usual
MIT







{ "tasks": [ { "label": "Make it", // User-defined task "type": "shell", ... }, { "label": "npm: install", // Provider task with verbatim name "type": "npm", "script": "install", ... }, { "label": "dev", // Renamed provider task "type": "npm", "script": "watch", ... }, { "type": "npm", // Provider task WITHOUT a label "script": "test", "group": "test", ... } ] }