Hover message for glyph decorations are not displayed

[akosyakov]

I have glyphMargin enabled and generally it looks good but hover messages are not displayed. You can easily reproduce it in the playground.

[alexdima]

Hm, I could get it working:

https://microsoft.github.io/monaco-editor/playground.html#interacting-with-the-editor-rendering-glyphs-in-the-margin

var jsCode = [
	'"use strict";',
	'function Person(age) {',
	'	if (age) {',
	'		this.age = age;',
	'	}',
	'}',
	'Person.prototype.getAge = function () {',
	'	return this.age;',
	'};'
].join('\n');

var editor = monaco.editor.create(document.getElementById("container"), {
	value: jsCode,
	language: "javascript",
	glyphMargin: true
});

var decorations = editor.deltaDecorations([], [
	{
		range: new monaco.Range(3,1,3,10),
		options: {
			className: 'myContentClass',
			glyphMarginClassName: 'myGlyphMarginClass',
            glyphMarginHoverMessage: 'glyph margin hover message'
		}
	}
]);

[akosyakov]

There is no glyphMarginHoverMessage property in monaco.d.ts only hoverMessage: https://github.com/Microsoft/monaco-editor/blob/master/monaco.d.ts#L1547.

[alexdima]

Indeed, looks like microsoft/vscode@51f2d53 didn't adopt MarkedString in glyphMarginHoverMessage

[starpit]

FYI i don't see the hover message after making the noted modification to the noted example. 0.11.1, on any of firefox 59.0.2, chrome 65.0.3325.181, or electron 1.8.4

[rcjsuen]

@starpit The following code works for me.

var jsCode = [
	'"use strict";',
	'function Person(age) {',
	'	if (age) {',
	'		this.age = age;',
	'	}',
	'}',
	'Person.prototype.getAge = function () {',
	'	return this.age;',
	'};'
].join('\n');

var editor = monaco.editor.create(document.getElementById("container"), {
	value: jsCode,
	language: "javascript",
	glyphMargin: true
});

var decorations = editor.deltaDecorations([], [
	{
		range: new monaco.Range(3,1,3,1),
		options: {
			isWholeLine: true,
			className: 'myContentClass',
			glyphMarginClassName: 'myGlyphMarginClass',
			glyphMarginHoverMessage: { value: 'glyph margin hover message' }
		}
	}
]);

[starpit]

ah, thank you @rcjsuen the key difference from the comments above is in

			glyphMarginHoverMessage: { value: 'glyph margin hover message' }

compared to the above

			glyphMarginHoverMessage: 'glyph margin hover message'

which does not work

[rcjsuen]

@starpit Correct. The API has changed so you need to use IMarkdownString | IMarkdownString[].

https://github.com/Microsoft/monaco-editor/blob/6fa2a2ec0ee0809a855c1e88995b21145c43c22e/monaco.d.ts#L1167-L1170