El modo HTML de CodeMirror no funciona
Estoy intentando diseñar ejemplos de código con CodeMirror, pero funciona parcialmente: aplica el tema seleccionado a latextarea pero la sintaxis no está resaltada.
Ahí está mi página:
<textarea id="template-html" name="code" class="CodeMirror">
<!DOCTYPE html>
<foobar>
<blah>Enter your xml here and press the button below to display it as highlighted by the CodeMirror XML mode</blah>
<tag2 foo="2" bar="bar" />
</foobar>
</textarea>
<link rel="stylesheet" type="text/css" href="/site.com/css/codemirror/codemirror.css">
<link rel="stylesheet" type="text/css" href="/site.com/css/codemirror/theme/ambiance.css">
<link rel="stylesheet" type="text/css" href="/site.com/css/codemirror/theme/solarized.css">
<script type="text/javascript" src="/site.com/js/libs/codemirror/codemirror.js"></script>
<script type="text/javascript" src="/site.com/js/libs/codemirror/mode/javascript/javascript.js"></script>
<script type="text/javascript">
var config, editor;
config = {
lineNumbers: true,
mode: "text/html",
theme: "ambiance",
indentWithTabs: false,
readOnly: true
};
editor = CodeMirror.fromTextArea(document.getElementById("template-html"), config);
function selectTheme() {
editor.setOption("theme", "solarized dark");
}
setTimeout(selectTheme, 5000);
</script>
Aquí hay una imagen del resultado. Parece funcionar, pero sin el resaltado de sintaxis (imagen superior), también lo he intentado sin mi CSS, pero el resultado es el mismo (parte inferior de la imagen):
El problema es conmode: "text/html" que parece no estar funcionando correctamente, si usomode: "javascript" colorea las etiquetas por las reglas de sintaxis de JavaScript. ¿Cómo puedo arreglar esto?