rui lopes notebook

Fix SyntaxHighlighter to display tumblr Markdown URLs

I write these tumblr blog posts using the Markdown syntax, which automatically detects and transforms URLs into proper HTML links. Though, things get messed up when I syntax highlight them with SyntaxHighlighter.

I see something like (as displayed by the browser):

http://example.com

instead of the expected:

http://example.com

So I dug into the code, and come up with this patch (apply into revision b7578b438a69):

--- a/scripts/shCore.js
+++ b/scripts/shCore.js
@@ -286,7 +286,6 @@
  highlight: function(globalParams, element)
  {
    var elements = this.findElements(globalParams, element),
-     propertyName = 'innerHTML', 
      highlighter = null,
      conf = sh.config
      ;
@@ -322,7 +321,7 @@
          continue;
      }
      
-     code = target[propertyName];
+     code = target.innerText || target.textContent;
      
      // remove CDATA from <SCRIPT/> tags if it's present
      if (conf.useScriptTags)

The text to highlight is now obtained from the innerText (works on IE / Chrome) or the textContent (works on Firefox / Chrome) property.

I’m left wondering why innerHTML was used in the first place… anyway, it now works as I expected!

– RGL