Can help to tell me how to set "readOnlyMessage" in monaco-editor

[liamlull]

I am try to create monaco-editor with these options, But I don't want to use the "Cannot edit in read-only editor" tips when user want to edit it. So I am try to use the "readOnlyMessage" to change the tips.

But I found my config is not work, Because the "readOnlyMessage" must be an "IMarkDownString" Object, Can tell me which attribute in "IMarkDownString" can change the tips

[LaamGinghong]

With the same issue.

[Tsai5277]

readOnlyMessage config don't work

[sKopheK]

https://microsoft.github.io/monaco-editor/typedoc/interfaces/editor.IEditorOptions.html#readOnlyMessage
https://microsoft.github.io/monaco-editor/typedoc/interfaces/IMarkdownString.html

this code works for me to disable read-only tooltip message:

readOnlyMessage: {
    value: null,
},

[Fiera42]

This solution vaguely works: by using "null", you force monaco to throw an error wich prevent the message from appearing

if you want to customize the readOnlyMessage or hide it, prefere using this:

readOnlyMessage: {
    value: "This is an exemple message, replace me by an empty string to remove the popup", 
    isTrusted: true // Must be true for the param to be effective
}

[bthilak-altair]

Is this really working @Fiera42 ?

[sKopheK]

This solution vaguely works: by using "null", you force monaco to throw an error wich prevent the message from appearing

if you want to customize the readOnlyMessage or hide it, prefere using this:

readOnlyMessage: {
    value: "This is an exemple message, replace me by an empty string to remove the popup", 
    isTrusted: true // Must be true for the param to be effective
}

you mention "hiding" the message, but how would you do that not using null?

[bthilak-altair]

Any update on this ticket?, not able to update the readOnlyMessage's value

[Fiera42]

Hello, have you tried my solution ? It did the job for me

[bthilak-altair]

Yes, this is the prop i passed as an option

        readOnly: true,
        readOnlyMessage: {
          value: '',
          isTrusted: true,
        },

Still, I see the tooltip popping up with content ''Cannot edit in read-only editor"

[Fiera42]

Oh, are you at least able to change the message by passing a non-empty string ? I must admit I did not tested the empty-string bit

I guess you'll just have to use the "null" technique and get errors in the console... Check out the doc to see if there is any boolean hanging somewhere that you could use to disable the messages

[bthilak-altair]

Yes, I tried passing empty string and null, nothing works for me

[Fiera42]

Unfortunatly I can't help you more, good luck with that and don't forget to post your findings for future readers

[Rahul5546-X]

@bthilak-altair This seems to do the job for me:-
The editorRef strore the instance of the editor that we get from the onMount callback.

editorRef.current!.updateOptions({
readOnly: true,
// readOnlyMessage: { value: 'Custom message'}
readOnlyMessage: { value: '' }
});

In my case, there is no tooltip message when I tries to edit, just a down arrow appears.

[bthilak-altair]

I have tried this one already, this didn't solve a problem for me, BTW, thanks @Rahul5546-X

[Rahul5546-X]

@bthilak-altair You can try this in Monaco Editor playground(Editor Basic Options)

Link to the playground:- https://microsoft.github.io/monaco-editor/playground.html?source=v0.52.2#example-creating-the-editor-editor-basic-options

var editor = monaco.editor.create(document.getElementById("container"), {
value: "// First line\nfunction hello() {\n\talert('Hello world!');\n}\n// Last line",
language: "javascript",
lineNumbers: "off",
roundedSelection: false,
scrollBeyondLastLine: false,
readOnly: true,
// readOnlyMessage:{value:null}, // Will show no tooltip
// readOnlyMessage:{value:''}, // Will show tooltip with just down arrow.
readOnlyMessage:{value:'custom read only message'}, // Will show custom tooltip message
theme: "vs-dark",
});

[DavidSeptimus]

Another option I haven't seen posted anywhere that would nuke the readonly message entirely would be to invoke dispose on the editor instance's editor.contrib.readOnlyMessageController contribution.

editor.getContribution("editor.contrib.readOnlyMessageController")?.dispose();