Marker is placed on the wrong line after page visibility change


Currently, in firefox when you open the developer tools panel and debug a document in the debugger tab and try to apply a marker to a line it works just fine. Although if you switch tabs, changing the visibility of the debugger tab to hidden then go back to the debugger tab you will see that the lines viewed in the document are still the same, which is good. Although, when you go to add a marker on a line without scrolling or clicking anywhere in the codemirror editor, the marker will be applied to a line near the top, rather than what is displayed.

Here is the original issue that I am working on:

Here is a gif showing what was described.

So far I have tried detecting when the change in visibility occurs and when the editor becomes revisable, calling a codeMirror.refresh(), and also signalling different codeMirror events such as “refresh”, “update”, and a few others with CodeMirror.signal(…). The only thing that has worked thus far is to get the scrollInfo which seems to correspond to that of what is seen in the browser and scroll to the respective line.

I was just wondering if anyone had any recommendations on what I should do next. Let me know if this should be opened as a issue in the github repo and I would love to help with implementing a solution.


  • This is not an issue when running the debugger simply by itself as its own application not in the firefox panel. After looking at the signals sent out in each case upon a visibility change, it was found that only in the breaking case (the firefox panel) does the codeMirror editor fire a “refresh” signal.
  • After looking into where the refresh is sent from, it is sent from onResize --> setSize.


Is it possible that there is asynchronous updating going on, causing the refresh call to happen before the actual layout update?


Thanks for the input @marijn, you were right, and yes, the change in visibility is detected, and hence the refresh is executed before the actual layout is updated. I was just wondering if you had any suggestions on the best way to wait for codeMirror to finish updating. I was trying to go off the codeMirror signals with no success.


refresh is synchronous, you don’t need to wait for it.


Sorry I mean to say, how to know when the layout is finished updating, for instance, I see that no refresh signal is sent out after switching tabs but onResize() is sent out from forEachCodeMirror(f).


That depends on the code that is causing the update—it’s not something CodeMirror can control.