Question

so I have a textarea surrounded by a DIV container:

<div>
  <textarea id="code"> some text here </textarea>
</div>

and this textarea is tranformed into a code editor using CodeMirror:

CodeMirror.fromTextArea('code', {
  lineNumbers: true,
  matchBrackets: true,
  mode: 'text/html'
});

the problem is that when the container of the textarea is hidden (some times it is, depending on what the user chooses to display), then after toggling to unhide it the CodeMirror editor doesn’t appear like it should. It only shows one line, and you have to actually click inside it to redraw and show properly.

Does anyone know a fix for this?

Answer 1

refresh()
If your code does something to change the size of the editor element (window resizes are already listened for), or unhides it, you should probably follow up by calling this method to ensure CodeMirror is still looking as intended.

from CodeMirror manual (assuming you’re using version 2)