Force a layout pass programmatically

v6
1

Hi @marijn recently I noticed a really minor layout problem with my app, the height of line number gutters is not initially correct:

image
image1774×1294 349 KB

It will eventually be corrected at some point (it’s an eye-blinking thing):

image
image1774×1294 366 KB

However, this brings a UI glitch to users. I noticed that if I fake a text edit with something like this:

editor.dispatch({ changes: { from: 0, insert: ' ' } }); // undo the change later

The editor will perform the layout earlier, and it “fixes” the issue. I know this is not the ideal way to trigger a layout, do you have any recommendations that I am not aware of?

P.S. requestMeasure won’t do the trick :frowning:

Thanks!

2

Could it be that your fonts or styles are loading after the editor initializes? A view.requestMeasure() should cause it to re-measure its layout. Sometimes it helps to do this on a "load" event.

3

Thanks for the quick reply. I was thinking about the same thing, but it seems I can repro even with plain styles.

I will try if moving requestMeasure to other places work, thanks.

4

Update: it doesn’t work, seems right now faking a text edit is the only way that works, lol.

5

If you can simplify the case where the editor loads up incorrectly to an HTML/JS page that uses no dependencies beyond CodeMirror, I’ll gladly debug it.

6

Thanks for being so kind. This is a good point, I don’t use other dependencies, but the project is getting a bit complicated now, I think a minimal repro would help me understand the issue better.

Will update this thread once I have one.