On scrolling with parent and content-loading on scroll

v6
1

Greetings!

I would just like to confirm if it’s expected that not using the cm-scroller as the scroll element leads to jumpy scrolling?

I am using codemirror for a markdown editor styled to look like normal text with monospace fonts only inside fenced codes, with the monospace style provided as line decorations. I’m also using a grandparent element as the scroll element as there are other elements below the editor. I’ve noticed that depending on how much wrapped fence code there is and the width of the monospace font, scrolling introduces some jumpiness presumably because the editor only has an estimated height, and the different font styling messes with the estimated height.

I’ve peeked a bit into the source code and it looks like this is remedied when EditorView.measure sets scrollDOM.scrollTop back to before the content was rendered. I also tried to create a reproducible example in the Codemirror website, but couldn’t reproduce this issue until I removed the overflow styling of cm-scroller.

Does this mean that the jumpy scrolling is expected when not using scrollDOM for scrolling? I would just like to make sure in case there’s a way that I wasn’t able to find (or perhaps there are some other issues on my end).

Thank you very much!

Edit: I should note that this is more prominent when pasting a bunch of text and scrolling up

2

This ended up being a CSS styling issue on my end.

3

How did you get it fixed eventually?

The jumpiness is really something else, I’d click on line 5 and the editor would some unnecessary jumping or shifting. It is tiring :smiley:

4

It’s probably different if just clicking would cause jumps. Mine ended up being fixing the styling of flex boxes (I also fudged with the editor dom layout and cm-scroller css sometime ago so cleaning that up fixed it for me)

1 Like