Support auto-highlighting for preformatted code

AI-generated summary

The discussion is about adding auto-highlighting for preformatted code in Discourse. Naatan suggested exposing Highlightjs’ “auto highlighting” functionality through an admin preference. lightyear mentioned that Highlightjs already uses auto-mode internally if no language is specified, but Naatan provided an example of code that wasn’t being highlighted automatically.

After investigation, lightyear found that the issue was due to something Discourse does before passing the code to Highlightjs. A pull request was made to fix the issue, but codinghorror pointed out that preformatted text shouldn’t be syntax highlighted by default, and that a site setting is needed.

The feature is now behind a site setting, with the default being “off”. Naatan is happy with this solution, as it allows his community to default to code highlighting.

Additionally, lidel asked about the supported languages in Discourse’s Highlightjs. He found that it only supports a small subset of languages and suggested including a build with more languages by default or adding an admin setting to allow custom Highlightjs builds. lidel also provided a temporary hack to add missing languages to his instance.

Highlightjs offers “auto highlighting” out of the box. It’d be nice if this functionality could be exposed to Discourse through an admin pref (eg. “Auto highlight preformatted code”). I understand this won’t be relevant for all forums but for some forums (such as the one I manage) it is highly preferable.

Hey @Naatan,

we are using the custom highlightBlock feature to only have highlistjs render the code-parts of the markdown (see https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/lib/syntax_highlighting.js#L21 ). Now from what I can read in the highlight.js’s source code, it internally does use the Auto-Mode if no language is specified. See line 512 in the highlightBlock function.

Can you show us an example of where and when it doesn’t work but it does with the library outside of discourse? Then I’d gladly debug it, otherwise I’d say the request needs to go to highlightjs …

So far all the code that was inserted using the “Preformatted text” button in the editor has appeared without highlighting on our forums.

An example snippet that I had to manually edit to add the tripple quotes and language definition:

var sm = ko.views.manager.currentView.scimoz;
// Get character length:
var msg = "Length: " + sm.getTextRange(0, sm.currentPos).length;
// Get byte length:
//var msg = "Length: " + sm.currentPos;

// Use statusbar to show where you are:
ko.statusBar.AddMessage(msg, "find", 5000, true);

Seems to not be working here either? Of course I can manually add the tripple quotes and language definition but the point is that this should happen automatically when using the “Preformatted text” button.

Thanks, I’ll look into it. Maybe it’s something we do before we give it to highlightjs …

I don’t think a system setting is needed for this. I don’t see why it shouldn’t always kick in. Made a pull-request fixing your issue:

https://github.com/discourse/discourse/pull/2204

1개의 좋아요

This is incorrect – we don’t want preformatted text to be syntax highlighted by default.

If are posting code, use a code fence.

This should be behind a site setting at a bare minimum – most communities do not care about source code at all, but will find uses for fixed-width font areas..

1개의 좋아요

Right that’s what I figured. I’d still like it to be behind a setting though so that for my community (and other communities like it) it can default to code highlighting, as this is highly preferable given the subject of the community that I manage.

As long as it is behind a site setting that is fine @lightyear. Default off.

3개의 좋아요

Superseeded. Now with SiteSettings:

https://github.com/discourse/discourse/pull/2204

I’d still argue that syntactically speaking the viewer shall be allowed to assume that anything inside <pre> <code>...</code> </pre> to be code. I’d say this is a bug in the renderer (compatible markdown) spitting out code-block where there shall not be one.

Update: of yeah, of course. Default is ‘off’ – the normal behaviour.

4개의 좋아요

Thanks @lightyear - works perfectly :slight_smile:

1개의 좋아요

Is there a general rule on which languages are supported by Discourse?

Highlight.js shipped with Discourse recognises only a small subset of all supported languages.

> JSON.stringify(hljs.listLanguages())
< ["bash","cs","ruby","diff","javascript","xml","markdown","css","http","java","php","python","sql","handlebars","ini","perl","objectivec","coffeescript","nginx","json","apache","cpp","makefile","go"]

I see that highlighting of Go code was added just recently. Personally, I miss TeX, Haskell, Lua, Groovy and Erlang.

Is it feasible to include highlight,js build with more languages by default?

I understand that for most of communities most of uncommon languages are irrelevant and shipping smaller library helps with performance. But how can I add missing language to my instance?

Perhaps it would be beneficial to add an Admin setting with URL of highlight.pack.js (similar to this PR for discourse-mathjax plugin)? That way I could build my own version of the library.

What would be the best way to solve this?

1개의 좋아요

As a quick hack I added missing languages with this small addition to app.yml:

hooks:
  after_code:
    - exec:
        cd: $home
        cmd:
          - curl http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.2/languages/haskell.min.js >> $home/public/javascripts/highlight.pack.js
          - curl http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.2/languages/lua.min.js >> $home/public/javascripts/highlight.pack.js
          - curl http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.2/languages/tex.min.js >> $home/public/javascripts/highlight.pack.js
2개의 좋아요