Updates not synchronised with requestMeasure and ViewPlugin

v6
3

Hmm, I thought this wasn’t the case because I wasn’t able to get it working before, but it turns out that I was having some weird behaviour when I was updating the ViewPlugin with condition of docChanged, viewportChanged, and geometryChanged. If I updated it every case without any conditions on update it works as intended, but other wise for some reason my changes get overwritten.

Heres a minimum example which where I add 140px left padding to the first line. Notice when you click the doc it resets the padding:

import { EditorView, ViewPlugin, ViewUpdate } from "@codemirror/view";

export class SoftWrapPlugin {
  constructor(view: EditorView) {
    this.buildDeco(view);
  }

  update(update: ViewUpdate) {
    if (update.docChanged || update.viewportChanged || update.geometryChanged) {
      // <-  this is causing issues. If you remove all condition it works as intended.
      this.buildDeco(update.view);
    }
  }

  buildDeco(view: EditorView) {
    view.requestMeasure({
      read: () => {
        return view.domAtPos(0).node; // Return cm-line element for the first line
      },
      write: (cmlineNode) => {
        (cmlineNode as HTMLElement).style.paddingLeft = "140px"; // Add a left padding of 140px to the element
      }
    });
  }
}

export let softWrap = ViewPlugin.define((view) => new SoftWrapPlugin(view));

The behaviour is even worst when using custom auto completion for some reason, where it’s a lot more apparent and clear there. Heres a gif:

Untitled1

As of now updating without any conditions works, but it may not be the best case for optimization. What may be going wrong here? Is there a better way to do this.