browser/devtools/sourceeditor/codemirror/README
author Margaret Leibovic <margaret.leibovic@gmail.com>
Wed, 11 Jun 2014 12:08:35 -0700
changeset 208988 5d3393c154010b7a95e3e2b30ac0a5c10c86e7f3
parent 195932 a18a1994465209b388c1671f7c80f16fc54ccd50
child 210980 55b0aa2da501b7999b09e168f203cad29f7233ca
permissions -rw-r--r--
backout 25fb66c1006f for test failure on a CLOSED TREE

This is the CodeMirror editor packaged for the Mozilla Project. CodeMirror
is a JavaScript component that provides a code editor in the browser. When
a mode is available for the language you are coding in, it will color your
code, and optionally help with indentation.

# Upgrade

Currently used version is 4.0.3. To upgrade, download a new version of
CodeMirror from the project's page [1] and replace all JavaScript and
CSS files inside the codemirror directory [2].

To confirm the functionality run mochitests for the following components:

 * sourceeditor
 * scratchpad
 * debugger
 * styleditor
 * netmonitor

The sourceeditor component contains imported CodeMirror tests [3].

 * Some tests were commented out because we don't use that functionality
   within Firefox (for example Ruby editing mode). Be careful when updating
   files test/codemirror.html and test/vimemacs.html; they were modified to
   co-exist with Mozilla's testing infrastructure. Basically, vimemacs.html
   is a copy of codemirror.html but only with VIM and Emacs mode tests
   enabled.
 * In cm_comment_test.js comment out fallbackToBlock and fallbackToLine
   tests.
 * The search addon (search.js) was slightly modified to make search
   UI localizable (see patch below).

Other than that, we don't have any Mozilla-specific patches applied to
CodeMirror itself.

# Addons

To install a new CodeMirror addon add it to the codemirror directory,
jar.mn [4] file and editor.js [5]. Also, add it to the License section
below.

# License

The following files in this directory are licensed according to the contents
in the LICENSE file:

 * codemirror.css
 * codemirror.js
 * comment.js
 * activeline.js
 * dialog/dialog.css
 * dialog/dialog.js
 * keymap/emacs.js
 * keymap/sublime.js
 * keymap/vim.js
 * fold/foldcode.js
 * fold/brace-fold.js
 * fold/comment-fold.js
 * fold/xml-fold.js
 * fold/foldgutter.js
 * xml.js
 * css.js
 * javascript.js
 * clike.js
 * htmlmixed.js
 * matchbrackets.js
 * closebrackets.js
 * trailingspace.js
 * search/match-highlighter.js
 * search/search.js
 * search/searchcursor.js
 * test/codemirror.html
 * test/cm_comment_test.js
 * test/cm_doc_test.js
 * test/cm_driver.js
 * test/cm_mode_javascript_test.js
 * test/cm_mode_test.css
 * test/cm_mode_test.js
 * test/cm_multi_test.js
 * test/cm_search_test.js
 * test/cm_test.js
 * test/cm_sublime_test.js
 * test/cm_vim_test.js
 * test/cm_emacs_test.js

# Localization patches

diff --git a/browser/devtools/sourceeditor/codemirror/search/search.js b/browser/devtools/sourceeditor/codemirror/search/search.js
--- a/browser/devtools/sourceeditor/codemirror/search/search.js
+++ b/browser/devtools/sourceeditor/codemirror/search/search.js
@@ -62,19 +62,31 @@
     if (isRE) {
       query = new RegExp(isRE[1], isRE[2].indexOf("i") == -1 ? "" : "i");
       if (query.test("")) query = /x^/;
     } else if (query == "") {
       query = /x^/;
     }
     return query;
   }
-  var queryDialog =
-    'Search: <input type="text" style="width: 10em"/> <span style="color: #888">(Use /re/ syntax for regexp search)</span>';
+  var queryDialog;
   function doSearch(cm, rev) {
+    if (!queryDialog) {
+      let doc = cm.getWrapperElement().ownerDocument;
+      let inp = doc.createElement("input");
+      let txt = doc.createTextNode(cm.l10n("findCmd.promptMessage"));
+
+      inp.type = "text";
+      inp.style.width = "10em";
+      inp.style.MozMarginStart = "1em";
+
+      queryDialog = doc.createElement("div");
+      queryDialog.appendChild(txt);
+      queryDialog.appendChild(inp);
+    }
     var state = getSearchState(cm);
     if (state.query) return findNext(cm, rev);
     dialog(cm, queryDialog, "Search for:", cm.getSelection(), function(query) {
       cm.operation(function() {
         if (!query || state.query) return;
         state.query = parseQuery(query);
         cm.removeOverlay(state.overlay, queryCaseInsensitive(state.query));
         state.overlay = searchOverlay(state.query, queryCaseInsensitive(state.query));

# Footnotes

[1] http://codemirror.net
[2] browser/devtools/sourceeditor/codemirror
[3] browser/devtools/sourceeditor/test/browser_codemirror.js
[4] browser/devtools/jar.mn
[5] browser/devtools/sourceeditor/editor.js