Skip to content

Refine debug toolbar #52490

Closed
Closed
@weinand

Description

@weinand

I've tried to compile issues and proposals from #2513 and #9093:

Today VS Code supports two locations:

  • floating on top of editor tabs (default)
  • pinned to debug viewlet header (new option)

"floating" debug toolbar issues:

  • floating debug toolbar can only be moved horizontally and its vertical position is not ideal
    • problem: floating debug toolbar hides tabs (but only in tab mode).
    • workaround: move floating debug toolbar to the left and make debug viewlet wide enough so that toolbar doesn't overlap with tabs.

"docked" debug toolbar issues:

  • debug actions only available in debug viewlet
    • problem: you cannot use debug buttons when debug viewlet is not active
    • workaround: use F1 or keyboard shortcuts
  • no debug configuration drop-down visible while debug session active
    • problem: another concurrent session cannot be easily started while one is active
    • workaround: use F1 or set "debug.showInStatusBar" to "onFirstSessionStart" and start session via quickpick
  • no session drop-down visible if debug viewlet is too narrow
    • problem: it is not really obvious that the CALLSTACK view could be used for switching sessions in this situation
    • workaround: make debug viewlet wider

Proposed Debug Bar locations:

Important requirements:

  • toolbar always visible (independent from which viewlet is active)
    • "docked" toolbar violates this
  • toolbar should not hide anything
    • "floating" toolbar violates this

My take:

The two important requirements could be easily addressed by a global toolbar, but VS Code doesn't provide one.
Since it is difficult to find a good solution that obeys both requirements, I propose a two-pronged approach:

  • improve "floating" toolbar (which will continue to be the default):

    • make it more suitable for editor tabs mode, e.g. by allowing to move it below the tabs, and/or
    • allow for unanchored free floating
  • improve "docked" toolbar (which is most likely covered by Show debug sessions under a new split view section #49881):

    • don't overlap docked toolbar with viewlet header but create a new view "SESSIONS"
    • show debug actions in the SESSIONs header
    • move the session drop-down into the SESSIONs content
    • as long as there is only a single debug session there is no need to expand the SESSION view and all debug actions are available through in the header anyway

Let's start by improving the "floating" toolbar.

Metadata

Metadata

Labels

debugDebug viewlet, configurations, breakpoints, adapter issuesfeature-requestRequest for new features or functionalityon-testplanrelease-notesRelease notes issues

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions