|
|
<!doctype html>
<title>CodeMirror: Version 4 upgrade guide</title><meta charset="utf-8"/><link rel=stylesheet href="docs.css"><script src="activebookmark.js"></script>
<div id=nav> <a href="https://codemirror.net"><h1>CodeMirror</h1><img id=logo src="logo.png"></a>
<ul> <li><a href="../index.html">Home</a> <li><a href="manual.html">Manual</a> <li><a href="https://github.com/codemirror/codemirror">Code</a> </ul> <ul> <li><a class=active href="#upgrade">Upgrade guide</a> <li><a href="#multisel">Multiple selections</a> <li><a href="#beforeSelectionChange">The beforeSelectionChange event</a> <li><a href="#replaceSelection">replaceSelection and collapsing</a> <li><a href="#changeEvent">change event data</a> <li><a href="#showIfHidden">showIfHidden option to line widgets</a> <li><a href="#module">Module loaders</a> <li><a href="#shareddata">Mutating shared data structures</a></li> <li><a href="#deprecated">Deprecated interfaces dropped</a> </ul></div>
<article>
<h2 id=upgrade>Upgrading to version 4</h2>
<p>CodeMirror 4's interface is <em>very</em> close version 3, but itdoes fix a few awkward details in a backwards-incompatible ways. Atleast skim the text below before upgrading.</p>
<section id=multisel><h2>Multiple selections</h2>
<p>The main new feature in version 4 is multiple selections. Thesingle-selection variants of methods are still there, but nowtypically act only on the <em>primary</em> selection (usually the lastone added).</p>
<p>The exception to thisis <a href="manual.html#getSelection"><strong><code>getSelection</code></strong></a>,which will now return the content of <em>all</em> selections(separated by newlines, or whatever <code>lineSep</code> parameter you passedit).</p>
</section>
<section id=beforeSelectionChange><h2>The beforeSelectionChange event</h2>
<p>This event still exists, but the object it is passed hasa <a href="manual.html#event_beforeSelectionChange">completely newinterface</a>, because such changes now concern multipleselections.</p>
</section>
<section id=replaceSelection><h2>replaceSelection's collapsing behavior</h2>
<p>Bydefault, <a href="manual.html#replaceSelection"><code>replaceSelection</code></a>would leave the newly inserted text selected. This is only rarely whatyou want, and also (slightly) more expensive in the new model, so thedefault was changed to <code>"end"</code>, meaning the old behaviormust be explicitly specified by passing a second argumentof <code>"around"</code>.</p>
</section>
<section id=changeEvent><h2>change event data</h2>
<p>Rather than forcing client code to follow <code>next</code>pointers from one change object to the next, the library will nowsimply firemultiple <a href="manual.html#event_change"><code>"change"</code></a>events. Existing code will probably continue to work unmodified.</p>
</section>
<section id=showIfHidden><h2>showIfHidden option to line widgets</h2>
<p>This option, which conceptually caused line widgets to be visibleeven if their line was hidden, was never really well-defined, and wasbuggy from the start. It would be a rather expensive feature, both incode complexity and run-time performance, to implement properly. Ithas been dropped entirely in 4.0.</p>
</section>
<section id=module><h2>Module loaders</h2>
<p>All modules in the CodeMirror distribution are now wrapped in ashim function to make them compatible with both AMD(<a href="http://requirejs.org">requirejs</a>) and CommonJS (as usedby <a href="http://nodejs.org/">node</a>and <a href="http://browserify.org/">browserify</a>) module loaders.When neither of these is present, they fall back to simply using theglobal <code>CodeMirror</code> variable.</p>
<p>If you have a module loader present in your environment, CodeMirrorwill attempt to use it, and you might need to change the way you loadCodeMirror modules.</p>
</section>
<section id=shareddata><h2>Mutating shared data structures</h2>
<p>Data structures produced by the library should not be mutatedunless explicitly allowed, in general. This is slightly more strict in4.0 than it was in earlier versions, which copied the position objectsreturned by <a href="manual.html#getCursor"><code>getCursor</code></a>for nebulous, historic reasons. In 4.0, mutating theseobjects <em>will</em> corrupt your editor's selection.</p>
</section>
<section id=deprecated><h2>Deprecated interfaces dropped</h2>
<p>A few properties and methods that have been deprecated for a whileare now gone. Most notably, the <code>onKeyEvent</code>and <code>onDragEvent</code> options (use thecorresponding <a href="manual.html#event_dom">events</a> instead).</p>
<p>Two silly methods, which were mostly there to stay close to the 0.xAPI, <code>setLine</code> and <code>removeLine</code> are now gone.Use the moreflexible <a href="manual.html#replaceRange"><code>replaceRange</code></a>method instead.</p>
<p>The long names for folding and completing functions(<code>CodeMirror.braceRangeFinder</code>, <code>CodeMirror.javascriptHint</code>,etc) are also gone(use <code>CodeMirror.fold.brace</code>, <code>CodeMirror.hint.javascript</code>).</p>
<p>The <code>className</code> property in the return valueof <a href="manual.html#getTokenAt"><code>getTokenAt</code></a>, whichhas been superseded by the <code>type</code> property, is also nolonger present.</p>
</section></article>
|
