The hoverMessage and glyphHoverMessage in IModelDecorationOptions for the DeltaDecorations in the Editor seem to be broken. Have seen this on multiple machines, thought it was something I had done wrong at first, but can repro in the online playground as well.
monaco-editor version: 0.12 & 0.13.1 (Playground Editor Version)
Browser: Edge & Firefox
OS: Windows 10 16299
Steps or JS usage snippet reproducing the issue:
From glyphs in margin demo:
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: {
isWholeLine: true,
className: 'myContentClass',
glyphMarginClassName: 'myGlyphMarginClass',
hoverMessage: ["Testing", "**???**"],
glyphMarginHoverMessage: "Testing this out..."
}
}
]);
// You can now use `decorations` to change or remove the decoration
If you hover mouse over glyph or line, no hover text appears. This worked fine in v0.10.
(you're also missing the changelog for 0.13, but looks like I'll have to downgrade :( )
@hawkerm Regarding the changelog, it's there in the v0.13.0 tag but that tag seems to be ahead of master now that you mention it.
@hawkerm Both glyphMarginHoverMessage and hoverMessage are now instances of IMarkdownString.
Please try the following code instead:
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: {
isWholeLine: true,
className: 'myContentClass',
glyphMarginClassName: 'myGlyphMarginClass',
hoverMessage: [
{ value: "Testing" },
{ value: "**???**" }
],
glyphMarginHoverMessage: { value: "Testing this out..." }
}
}
]);
Thanks @rcjsuen for the quick replies. Why the change in the API? What does the isTrusted property provide?