Skip to content

papio-dev/task-cockpit

Repository files navigation

Task Cockpit

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.json file and don't plan to create one
  • You prefer keyboard-driven workflow over panel-based UI

Task Cockpit panel showing hierarchical task tree

Features

Organization

  • Tasks grouped by workspace folder
  • Optional tree hierarchy by splitting labels into path segments, and/or grouping by group property
  • 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 hide field

Display

  • Respects task icon definition (id, color)
  • detail rendered 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

Behavior

  • Only tasks with explicit label property appear. Provider-detected tasks without an explicit label property are not shown:

    {
      "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",
          ...
        }
      ]
    }

    Result: only tasks with labels appear. The unlabeled npm: test task is not shown.

  • Global tasks (user-level tasks.json) are not shown — currently limited to workspace tasks.

Known Issues

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.

Installation

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.

Usage

  1. Open the Task Cockpit panel in the Activity Bar
  2. Your tasks appear in the tree
  3. Hover a task to reveal the Run Task button; right-click for more options
  4. 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.

Configuration

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 ().

Display

Configure visual appearance and hierarchy structure in the task explorer.

segmentSeparator

Character for splitting task labels into hierarchical segments.

See also taskCockpit.display.useGroupKind — grouping by group field, 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: builddevwatch.

Task label "build:dev:watch" split into hierarchical tree

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:

Task acting as both runnable task and group containing its dependencies

Hierarchy comes from segments only. The order of tasks in the file doesn't affect nesting — a:b and a:b:c always produce abc, 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.

Branch position determined by first occurrence, not by root task definition

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: install with : separator: Scriptsnpm: install (whitespace near :)
  • Compile/make in out/ with / separator: Compilemake in out/ (trailing slash ignored)

useGroupKind

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).

Tasks grouped by group property

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 BuildBuilddevwatch, 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.

useFolderIcon

Show folder icons for intermediate tree nodes.

defaultIconName

Icon name for tasks without a custom icon in their definition. Defaults to tools.

Available icons list.

Note

Tasks support a custom icon property (id and color). Task Cockpit respects these definitions.

Tasks with default and custom icons

Tip

To hide a task's icon, use blank as the icon name — it renders as an empty space.

tintLabel

Apply the task icon color to the task label text as well.

Task icon colors applied to label text

Filtering

Control which tasks and workspace folders are visible in the task explorer.

showHidden

Show tasks marked with hide: true.

excludeFolders

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)

excludeWorkspaceTasks

Deprecated. Use taskCockpit.filtering.excludeFolders instead.

Validation

Enable diagnostics to detect potential issues with task definitions.

Task Cockpit panel showing warnings about duplicate tasks and missing dependencies

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.

duplicateLabels

Flag tasks with duplicate labels. Helps avoid unexpected behavior when running tasks with identical names.

dependencies

(Experimental) Flag missing dependsOn references (default: false).

Custom Shortcuts

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.

Tip this project

If you find Task Cockpit useful:

License

MIT

About

VS Code extension for browse and execute user-defined tasks from your tasks and workspace files

Topics

Resources

License

Stars

Watchers

Forks

Sponsor this project

Contributors