Is there a way to dynamically remove/disable extension?

v6
1

Hello. I saw the examples in the documentation are getting more and more detailed, thanks for the hard work! However, I wonder if there is a way to dynamically remove/disable a certain extension?

The use case is to switch from a language to plain text, but compartment.reconfigure only accept extension and passing an empty [] doesn’t seem to work.

Thanks.

codemirror6 - vanilla - CodeSandbox

2

Reconfiguring with [] should work. Are you dispatching a transaction with the resulting effect?

3

Yes. I posted a minimum reproducible codes here: codemirror6 - vanilla - CodeSandbox

4

The reconfiguration was going through, but the highlighter was getting confused by the lack of new tree and preserving the old highlighting decorations. @codemirror/highlight 0.19.2 should fix this.

1 Like
5

Many thanks!

6

I’m having a problem getting Compartments to work too.

My code looks very similar to @jessuni’s so I’m not sure what’s going wrong:

  private _addedExtensions = new Set<Extension>()
  private _addedExtensionCompartment = new Compartment();

  addExtensions(extensions: Array<Extension>) {
    for (const extension of extensions) {
      this._addedExtensions.add(extension);
    }
    const effect = this._addedExtensionCompartment.reconfigure([...this._addedExtensions]);
    this.editorView!.dispatch({effects: [effect]});
  }

I’m calling: this.addExtension([lineNumbers()]) to trigger that, but my view is not updating.

Any ideas?

7

Did you include _addedExtensionCompartment.of([]) in your editor’s configuration? Reconfiguring compartment that aren’t in the editor will have no effect.

8

omg, that was it :man_facepalming:

I had it in there originally, but removed it in a refactoring. Thanks!