Is there a way to prevent scroll for collab edits? I’ve tested on the official collab example, page will scroll when other users are typing.

In this screen recording, the user selected the cursor text, and watching the document. While another user adding line breaks before. The cursor is moving out of the view port, which is not expected.

I did some research of scroll behavior of prosemirror-view. I’ve noticed storeScrollPos and resetScrollPos . Are they designed to prevent scroll for collab edits? And now, this.dom.style.overflowAnchor is '' so storeScrollPos and resetScrollPos are never hit. Is it by design or not?

Looking forward to the reply. Thanks.

In this screen recording, the user selected the cursor text, and watching the document. While another user adding line breaks before. The cursor is moving out of the view port, which is not expected.

The scroll for collab edits is caused by the HTML updates. The browser keeps the scrollTop, and the users will experience content shifting like scroll .

Is there a way to prevent that behavior when collab editing?

If the edits happen within your visible viewport, as in your demo, the behavior shown there looks reasonable.

ProseMirror does try to stabilize the scroll position for edits that happen above the viewport, but turns it off on browsers that have support for overflow-anchor (see this issue ), because having both the browser and the library try to stabilize resulted in over-compensation. On Firefox, and in most pages with Chrome, the browser-provided feature seems to work reliably, and the visible content stays in the same position when edits are made above the viewport. However, on the collab demo page, in Chrome, the browser seems to somehow fail to do its usual stabilization. I don’t know why — if I set up a simple page with a similar editor, I don’t see the problem occur. So given that, this looks like a Chrome issue.

Thanks for your detailed explanation.

I’ve tested that a simple page with a collab editor is not working as expected. And the collab example page is not in Chrome and in Firefox .

Code base: Glitch :･ﾟ✧ Chrome: failed.

Firefox: failed.

Safari: worked. I guess it’s because overflow-anchor is not supported in Safari.

The basic overflow-anchor is confirmed to be working as expected. I don’t know what’s the reason for that ProseMirror is not working. I’ll try more tests sometime.