Line Numbers Extension Not Updating on Reconfigure

I’m using CodeMirror with Vue. I am trying to make it so i can turn on/off line numbers. I have it working except when i turn on line numbers from after it is off, it doesn’t update visually until you change some state.

I make a Compartment for line numbers to initiate it at instantiation of CodeMirror:

getLineNumbersExension() {
    if (this.lineNumbers) {
        return lineNumbers();
    } else {
        return [];
const lineNumbersExtension = this.lineNumbersComp.of(this.getLineNumbersExension());

this.editorView = new EditorView({
    state: EditorState.create({
        doc: this.code,
        extensions: [... lineNumbersExtension ...],
    parent: this.$el,

Then if this.lineNumbers changes i do:

updateLineNumbersExtension() {
        effects: this.lineNumbersComp.reconfigure(this.getLineNumbersExension()),

Here is what it looks like:

So the main question is if there a better way to turn off line numbers other than reconfiguring the Compartment with just a []? Or is there a bug in the gutter code for updating the view?


A quick update. It looks like if foldGutter is on, then this issue doesn’t happen. But if it is off, then the issue persists.

That was a bug in the gutter view plugin. This patch should help.

Thank you!