Remove decoration type

[marabesi]

How do I remove the decoration type defined in this example?

[jrieken]

A TextEditorDecorationType is a disposable which can be removed/releaded by calling its dispose-method

[marabesi]

@jrieken even calling dispose on the decoration type object the style is not removed from the editor.

In the decorator app, a border is added around the numbers. How can I remove those borders?

The editor has a method called setDecorations, I guess I should call something like removeDecorations?

obs: I am trying to create an extension that adds a decorator and removes it when a rule is matched.

[jrieken]

Hm, @alexandrudima is the expert but try calling it with an empty array. That should tell the editor to not show decorations of that type anymore.

[marabesi]

I tried the approach suggested but it doesn't remove the style, here goes a snippet to illustrate what I've done:

activeEditor.setDecorations(smallNumberDecorationType, []); // I changed the variable 'smallNumbers' to be an empty array

But it didn't work.

I found an extension that has a method called resetDecorations, and it has a decorator called normalDecoration as far I understood it will remove all the style in a given range(is it the correct way to do that?), but unfortunately I couldn't make it work as well.

https://github.com/hoovercj/vscode-dimmer/blob/master/src/extension.ts

[jrieken]

Sorry, but my knowledge is exhausted. @aeschli or @alexandrudima are you folks, tho both are current on vacation so be a little patient.

[marabesi]

This issue hasn't been answered in a proper way, do I need to open a new one? Or just wait for @aeschli / @alexandrudima

[jrieken]

Both are out on vaccation 🌴 so please be patient

[alexdima]

@marabesi both answers from @jrieken are correct:

• option1 to nuke all uses of a certain decoration type across all editors is decType.dispose()
• option2 to nuke all uses of a certain decoration type in a single editor instance is editor.setDecorations(decType, [])

Most issues I've seen in code that uses this API are around using the wrong instance of decType (i.e. creating new decoration types every time decorations would be updated instead of reusing the same instance). Note how the example code creates two decoration types that it uses for the lifetime of the extension. Check how often you call vscode.window.createTextEditorDecorationType and that you correctly .dispose() these objects once you are done with them.

[vasilev-alex]

@alexandrudima I have a weird behavior of decorationType. I'm using SVG file as gutterIconPath and I have a feature of changing SVG color using fs. For example after showing an icon with blue color a user changes the color in the settings and gets back to the editor where the gutterIconPath color is supposed to change. However the color changes only after vscode relaunch.

let gutterIconPath: string = context.asAbsolutePath("images/icon.svg");
let dt: vscode.TextEditorDecorationType = vscode.window.createTextEditorDecorationType({
  gutterIconPath,        
  isWholeLine: true        
});
vscode.window.activeTextEditor.setDecorations(
  dt,
  [new vscode.Range(0, 0, 0, 0)]
);

// Then suppose a user changes the color in the settings 

const svgContent = '...'; // svg with a new fill attribute
fs.writeFileSync(context.asAbsolutePath(`images/icon.svg`), svgContent, 'utf8');

dt.dispose();

dt = vscode.window.createTextEditorDecorationType({
  gutterIconPath,        
  isWholeLine: true        
});
// Expect the color to change (Doesn't work...)
vscode.window.activeTextEditor.setDecorations(
  dt,
  [new vscode.Range(0, 0, 0, 0)]
);

Any ideas on that?

[alexdima]

@vasilev-alex Very likely the files contents are cached by the rendering engine. You can generate a new file name every time.

[vasilev-alex]

Yeah, it worked out

[juliandolby]

@marabesi both answers from @jrieken are correct:

* option1 to nuke all uses of a certain decoration type across all editors is `decType.dispose()`

* option2 to nuke all uses of a certain decoration type in a single editor instance is `editor.setDecorations(decType, [])`

Most issues I've seen in code that uses this API are around using the wrong instance of decType (i.e. creating new decoration types every time decorations would be updated instead of reusing the same instance). Note how the example code creates two decoration types that it uses for the lifetime of the extension. Check how often you call vscode.window.createTextEditorDecorationType and that you correctly .dispose() these objects once you are done with them.

thanks @alexdima, that clear and straightforward comment showed me how to solve the same problem in a different context.

[Trass3r]

@alexdima

* option2 to nuke all uses of a certain decoration type in a single editor instance is `editor.setDecorations(decType, [])`

Most issues I've seen in code that uses this API are around using the wrong instance of decType (i.e. creating new decoration types every time decorations would be updated instead of reusing the same instance). Note how the example code creates two decoration types that it uses for the lifetime of the extension.

Shouldn't the docs be improved then, given that this regularly causes confusion?
https://code.visualstudio.com/api/references/vscode-api#TextEditor.setDecorations
Like replace the term Adds with Updates and add all of the above info.

* option1 to nuke all uses of a certain decoration type across all editors is `decType.dispose()`

Starting from setDecorations you have to click twice and then also expand the dispose method (which probably nobody does) to find that information:
https://code.visualstudio.com/api/references/vscode-api#TextEditorDecorationType

[alexdima]

@Trass3r PR to improve docs welcome. Here is the JSDoc https://github.com/microsoft/vscode/blob/45c70c29e572de3e9ca24d993f0616fd31f05029/src/vs/vscode.d.ts#L1152

To be fair, the second sentence explains things:

> Adds a set of decorations to the text editor. If a set of decorations already exists with
> the given [decoration type](#TextEditorDecorationType), they will be replaced.

[evaxliu]

Dispose worked for me. But if I wanted to re-set the decorator again, would I had to force the user to reload the window? That was my only solution thus far. Is there a way to re-set the decorators without reloading the entire window.