Is there a way to set editor to readOnly when you can only access the EditorView, EditorState, and an instance of editorview in the new CM?

1

I am reading through a project that uses codemirror (written in ts, which I am not fluent in) and, I am looking at the code where the cm editor is initialized.

It is something like this:
A listener object is created with EditorView.updateListener. An editorView object is created with new EditorView, passing a state with EditorState.create.

Then the editorView.dom is appended to some element and their function returns the editorView instance.

I am trying to set it to readOnly and I just cannot figure out how / if this is possible when this is initialized. I thought maybe something to do with the transactions, but I can’t find anything like that. Previously I found cm.setOption, but I couldn’t find a way to that method within the context of this function.

Any help or ideas is appreciated!

2

It should be doable @unhott.

In your instantiation location, pass in the following extension:

new EditorView({
  state: EditorState.create({
    doc: 'my document text goes here',
    extensions: [
      ...someOtherExtensions,
      EditorView.editable.of(false)
    ]
  }),
})

It’s a little more complicated setup in our project, as the readOnly setting can change dynamically after render, but you can see how we’ve done it here.

Oh, and this is how we update the readOnly state later on after the editor has been initialized.

3

Thank you so much! I got it working during initialization, I’m going to need to stumble around for a while before I can figure out how toggling the property would fit into this project, but this is exactly what I needed!