First of all I would like to express my admiration for CodeMirror and the people behind it! I am extremely impressed by the many smart approaches CodeMirror is using to perfectly “fake an editable control”.
Out of curiosity, I have one questions to which I could not find an answer in the documents I have read (including Marijn Haverbeke’s blog on CodeMirror’s “internals”).
How does CodeMirror manages and highlights selections in the editor? document.getSelection() only returns the selection in the hidden <textarea> within the hidden <div> at the “fake” cursor’s position (all of which can found in the DOM). However, there seems to be no element in the DOM that “marks” the visible selection in the editor. Therefore, I assume that the visible selection is an “actual” selection of the text (using the browser’s “mechanisms”) in the different <spans> and the characters between them. But than again, if that is true, why is that selection “unknown” to the browser (hence, document.getSelection() does not return the visible selection)?
I would be grateful for any hint. Thank you very much in advance!