TextualBody: only highlight code block if language was specified

The highlight.js autodetection is finicky and often wrong, so disable highlighting unless the language was explicitly specified, or if the user has explicitly enabled it in the settings. Fixes element-hq/element-web#508. Signed-off-by: Johannes Löthberg <johannes@kyriasis.com>
kyrias · Jun 26, 2017 · 0fce921 · 0fce921
1 parent 468f65e
commit 0fce921
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 1 deletion.
diff --git a/src/components/structures/UserSettings.js b/src/components/structures/UserSettings.js
@@ -93,6 +93,10 @@ const SETTINGS_LABELS = [
         id: 'disableMarkdown',
         label: 'Disable markdown formatting',
     },
+    {
+        id: 'enableSyntaxHighlightLanguageDetection',
+        label: 'Enable automatic language detection for syntax highlighting',
+    },
 /*
     {
         id: 'useFixedWidthFont',

diff --git a/src/components/views/messages/TextualBody.js b/src/components/views/messages/TextualBody.js
@@ -29,6 +29,7 @@ import Modal from '../../../Modal';
 import SdkConfig from '../../../SdkConfig';
 import dis from '../../../dispatcher';
 import { _t } from '../../../languageHandler';
+import UserSettingsStore from "../../../UserSettingsStore";
 
 linkifyMatrix(linkify);
 
@@ -90,7 +91,17 @@ module.exports = React.createClass({
                 setTimeout(() => {
                     if (this._unmounted) return;
                     for (let i = 0; i < blocks.length; i++) {
-                        highlight.highlightBlock(blocks[i]);
+                        if (UserSettingsStore.getSyncedSetting("enableSyntaxHighlightLanguageDetection", false)) {
+                            highlight.highlightBlock(blocks[i])
+                        } else {
+                            let classes = blocks[i].className.split(/\s+/).filter(function (cl) {
+                                return cl.startsWith('language-');
+                            });
+
+                            if (classes.length != 0) {
+                                highlight.highlightBlock(blocks[i]);
+                            }
+                        }
                     }
                 }, 10);
             }

diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
@@ -268,6 +268,7 @@
   "Email address (optional)": "Email address (optional)",
   "Email, name or matrix ID": "Email, name or matrix ID",
   "Emoji": "Emoji",
+  "Enable automatic language detection for syntax highlighting": "Enable automatic language detection for syntax highlighting",
   "Enable encryption": "Enable encryption",
   "Enable Notifications": "Enable Notifications",
   "enabled": "enabled",