Horizontal scrollbar resize issue


Horizontal scrollbar is resizing when scrolling along document document.

Horizontal Scrollbar Issue

If I get it right, the issue comes from the “viewport” as CM is rendering only a slice of the document.
Of course, this behavior is mandatory to insure performances.
@marijn, do you think would it be possible to “enforce” the width of the “cm-scroll” element to prevent this issue ?

I would be please to collaborate on this if you need any help.
Best regards,


Here is a simple view plugin that partially fix the issue.
Scrollbar is still growing up along the document but it doesn’t shrink.

      class {

        private _minWidth: number;

        constructor(readonly view: EditorView) {
          this._minWidth = view.scrollDOM.clientWidth;

        update(): void {
          this._minWidth = Math.max(this._minWidth, this.view.contentDOM.scrollWidth);
          this.view.contentDOM.style.minWidth = `${this._minWidth}px`;

There is code like this already in the system, but it had been broken by a recent CSS tweak. The patch below should help. You won’t get the proper scroll width until the first time you scroll the widest line into view, but once you do, it should remain stable.

Perfect ! Thank you.