Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow customisation of debug toolbar (eg. additional buttons) #45116

Closed
DanTup opened this issue Mar 6, 2018 · 13 comments
Closed

Allow customisation of debug toolbar (eg. additional buttons) #45116

DanTup opened this issue Mar 6, 2018 · 13 comments
Assignees
Labels
debug Debug viewlet, configurations, breakpoints, adapter issues feature-request Request for new features or functionality on-testplan release-notes Release notes issues under-discussion Issue is under discussion for relevance, priority, approach
Milestone

Comments

@DanTup
Copy link
Contributor

DanTup commented Mar 6, 2018

In Flutter (a framework for developing mobile apps) we have two different types of restart during debugging:

  1. Stateful Hot Reload
  2. Full Restart

Since stateful hot reload is awesome, we've wired that up to the Restart button on the toolbar. In the case where this fails (eg. because you modified something that makes your state invalid) we have a status bar notification and an action in the command palette for a "Full Restart".

This has been a little confusing for users - they expect to see buttons for "Hot Reload" and "Restart" on the toolbar.

It would be great if we could supply an icon/tooltip for additional buttons (and a way of positioning them between existing buttons) and have it run a custom command.

@DanTup DanTup changed the title Aloow customisation of debug toolbar (eg. additional buttons) Allow customisation of debug toolbar (eg. additional buttons) Mar 6, 2018
@weinand weinand added the debug Debug viewlet, configurations, breakpoints, adapter issues label Mar 6, 2018
@weinand weinand self-assigned this Mar 6, 2018
@weinand weinand added under-discussion Issue is under discussion for relevance, priority, approach feature-request Request for new features or functionality labels Mar 6, 2018
@weinand weinand added this to the On Deck milestone Mar 6, 2018
@isidorn
Copy link
Contributor

isidorn commented Mar 6, 2018

This is a fair feature request.
We already have the editor title area where extensions can contribute actions and icons
Here's an example of markdown doing it.

So we would need to introduce a new menu id for the debug toolbar. For example 'debug/actionBar' - since we already call it actionbar in settings.
Positioning would be done by using the "group" property, so nothing new to introduce for this.

A nice thing about this is that we would be able to remove the chakra actions which do not really belong in the vscode core imho.

@weinand
Copy link
Contributor

weinand commented Mar 6, 2018

@isidorn Sorry, but there are no "chakra actions". The debug protocol supports reverse-back and reverse-continue and VS Code surfaces that in the UI. VS Code does not know anything about chakra (and the comment is wrong). Any debug extension can use that. So there is no way that we ever remove support for this.

@DanTup
Copy link
Contributor Author

DanTup commented Mar 6, 2018

Reverse continue?! That sounds bizzare!

So we would need to introduce a new menu id for the debug toolbar. For example 'debug/actionBar'

I was actually thinking this would work by sending a customRequest or similar to the DA (so it's similar to restartRequest), though since we have two-way communication between UI and DA now it doesn't worry me too much how it'd work.

@DanTup
Copy link
Contributor Author

DanTup commented Dec 10, 2018

@isidorn @weinand Do you think this is something that might happen anytime soon? I'm considering adding a setting to allow the user to control whether the Restart button will trigger a Reload or a Restart as a workaround, but it'd be much better if we could just give them both.

@weinand
Copy link
Contributor

weinand commented Dec 10, 2018

@DanTup We are investigating this is the Dec/Jan milestone.

@DanTup
Copy link
Contributor Author

DanTup commented Dec 10, 2018

@weinand Ok cool, I'll hang fire doing anything until it's clear if this may happen - thanks for the info!

@DanTup
Copy link
Contributor Author

DanTup commented Jan 29, 2019

@weinand Is there any news on this? If it's unlikely to happen, I might go ahead with adding a setting to control it instead. Thanks!

@weinand
Copy link
Contributor

weinand commented Jan 29, 2019

@DanTup we started investigating this but nothing will ship in the Dec/Jan milestone.

@DanTup
Copy link
Contributor Author

DanTup commented Jan 29, 2019

@weinand Thanks. I somewhat expected that, but do you think it might come soon? It's not urgent so if it's still likely to come, I'll hold off. If it may be some way off (or might not come) then it's more worthwhile me adding a setting.

Thanks!

@isidorn
Copy link
Contributor

isidorn commented Feb 21, 2019

Now the debug toolbar is customizable, extensions can add new items to it. The menu id of the debug toolbar is debug/toolbar.

We strongly recommend to use the when debugType context to avoid adding your actions for all debug types.
Currently it is possible to change the order of your contributed actions, however it is not possible to intermix them with the non contributed actions. This requires some debt work which I plan to tackle in the future (our debug actions need to be nicely contributed - here's the item to track it #69153)

Here's how my sample extension adds an action to the toolbar.
Try it out and let us know what you think.

"contributes": {
		"commands": [
			{
				"command": "extension.closeAll",
				"title": "Close All Editors in Group",
				"icon": {
					"light": "media/closeall.svg",
					"dark": "media/closeall_inverse.svg"
				}
			}
		],
		"menus": {
			"debug/toolbar": [
				{
					"command": "extension.closeAll",
					"group": "navigation",
					"when": "debugType == node2"
				}
			]
		}
	}

@isidorn
Copy link
Contributor

isidorn commented Feb 21, 2019

Note to self: we shuold update contribution points docs.

@DanTup
Copy link
Contributor Author

DanTup commented Feb 21, 2019

Awesome! I'm not sure how well it'll work prior to being able to put our new button next to the existing restart button, but I'm really excited this is coming - thanks!!

By the way - does this affect the touch bar at all? Currently there are debug buttons shown there - ideally when we insert a new "hot restart" button to the debug toolbar, it'd be nice to have it inserted into the same position in the touch bar too for consistency (I did try inserting buttons in between in the touch bar previously, but the separators disappeared and everything merged into one big button, so I'm not sure if it's supposed to work).

@bpasero bpasero modified the milestones: On Deck, February 2019 Feb 22, 2019
@isidorn
Copy link
Contributor

isidorn commented Feb 22, 2019

This does not affect the touch bar.

sandy081 pushed a commit to vldmrkl/vscode that referenced this issue Feb 22, 2019
@isidorn isidorn added the release-notes Release notes issues label Mar 4, 2019
@vscodebot vscodebot bot locked and limited conversation to collaborators Apr 7, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
debug Debug viewlet, configurations, breakpoints, adapter issues feature-request Request for new features or functionality on-testplan release-notes Release notes issues under-discussion Issue is under discussion for relevance, priority, approach
Projects
None yet
Development

No branches or pull requests

4 participants