OnClick event on Gutter

[alefragnani]

How could I handle OnClick events on Gutter, similar to how breakpoints does?

The intention was to connect it with a decorator (previously created with vscode.window.createTextEditorDecorationType) so the user should Click on the Gutter and create/destroy the decorator assigned to the line where the user clicked.

Thanks in advance

[AnneTheAgile]

Cross refs;
1.This, Right click in vscode edge, mentioned: "visual studio code - Add right click menu item inside gutter of vscode" - Stack Overflow ; ; https://stackoverflow.com/questions/41821174/add-right-click-menu-item-inside-gutter-of-vscode
2.Right click on file in Opsys ;
Add shortcut for file right click context menu. #15939
3.Right click in editor:
Custom menu entires, context menu entries, and action bar items #3192
3.1.Within the bgse/relative-path-and-line extension , their first request;
Feature Request: add actions to context menu #1
4.Click in Menu Bar of editor; this appears to be the item merged as a result of [3]
menu bar extensions #7704

[ThisIsABug]

@AnneTheAgile just for clarification: the origin of this feature request wasn't the possibility to expose a whole context menu, this is already working some pixels to the right of the gutter. So the user has a very similar possibility already.
The origin was here: alefragnani/vscode-bookmarks#24
It is just about the mentioned decorator. It is about a single left-click feature like toggling a breakpoint.

[sguillia]

There now is an onclick event on the gutter, when editing settings.json.

It doesn't seem exposed through the API though.

[sketchbuch]

This would be really useful. Any information about if this will happen? I'm making an extension where I want to click on a gutter icon that my extension creates and run a command and/or show a drop down menu.

[sudhagar10]

I started working on an extension assuming this was already exposed and now I am stuck.

I got misled by breakpoint and the edit icon appearing in the gutter of settings page.

[chakraborty-slx]

@sudhagar10 can you check this https://marketplace.visualstudio.com/items?itemName=ryanluker.vscode-coverage-gutters

[sudhagar10]

@sudhagar10 can you check this https://marketplace.visualstudio.com/items?itemName=ryanluker.vscode-coverage-gutters

Thanks @chakraborty-slx. Took a look at it.

I was able to place icons in gutter. But click event there is not exposed and that is where I am stuck.

[Almenon]

onHover would be useful too. For example in AREPL it would be cool if the user could hover over the error icon in the gutter to see the full exception message.

(commenting on this issue instead of a new one because I'm assuming it would be easy to add a onHover event along with onClick)

[canadaduane]

Has anyone begun working on this?

[helviett]

It would be a nice feature to have!

[ffMathy]

I would love this too!

[eamodio]

FYI, this issue is related to #47559

[luispDesktop]

It would be great to have this ability. Bump for this!
It greatly increases the ability to have options from icons showing in the gutter.

[nickzhums]

The Java team would also like to see this feature supported, as we are exploring various UX improvement to our Java & Spring extensions. It seems that this is an established UX behavior in Java IDEs and one of the user asks from our survey. If we can support not just click events to the icons next to the line numbers, but also expose some kind of menu (like current testing API), it would be awesome.

[rebmcr]

I want to be able to click the line number to make a bookmark — just like I have been able to do in Notepad++ for the past fifteen years.

[dennispi]

We're also seeing usability issues with our user testing and the existing interaction model.

Currently, users need to:

• hover over our extension's gutter icon
• observe the tooltip
• very carefully navigate over to the tooltip
• very carefully click on the Title on the tooltip
• begin interaction

This is much easier to understand when you see it:

What they're expecting:

• click the gutter icon
• (extension opens webview)
• user begins interaction

I the expectation is based on experience with breakpoints. Developers are conditioned to view a gutter icon, click on it, and take action.

We'd be happy to implement this as it seems to be a popular request from a number of extension authors (133 upvotes as of this comment).

[aldanchenko]

Hi all 👋

I'm correctly understood that this function is still not implemented?

[alefragnani]

@aldanchenko , you are right. It isn't available yet...

[aldanchenko]

I see. Thanks @alefragnani!

[weirane]

This is much easier to understand when you see it:

@dennispi May I ask what extension is this in the GIF? I'm trying to add hover messages on the gutter decoration but can't figure out how to do it. I think it'll be helpful to see how this extension does it.

[joyceerhl]

@alefragnani @nickzhums FYI, relatedly there's an API proposal to expose a context menu in the editor gutter #175945 in order to support copying links for a line or range. You can try it out in the latest insiders but it'll only work in development until finalization. Any feedback is appreciated.

[alefragnani]

@joyceerhl thanks for pointing that out! I'll definitely take a look, and let you know how to fit on my scenarios 👍

[alefragnani]

Hi @joyceerhl ,

I would say, at least on my side, that this issue can be closed as completed. 🎉

As I commented on the API Proposal (#175945 (comment)), the API worked perfectly. And I'm already using on my extensions.

Thank you!

[mcoblenz]

I'm not sure that a context menu suffices for our purposes. Can I make it so clicking an icon causes an action? Or must the icon open a context menu?

[mcoblenz]

I'm not sure that a context menu suffices for our purposes. Can I make it so clicking an icon causes an action? Or must the icon open a context menu?

(see https://marketplace.visualstudio.com/items?itemName=Kale-Lab.salt for the use case)