doc: all <pre> tags are highlighted as JavaScript

[DerekNonGeneric]

📗 API Reference Docs Problem

• Version: n/a
• Platform: n/a
• Subsystem: n/a

Location

Section of the site where the content exists

Affected URL(s):

• https://nodejs.org/api/embedding.html
• Any other document w/ a Markdown code fence

Problem description

Concise explanation of what you found to be problematic

While looking into #32938, I discovered that currently, every single <pre> tag gets highlighted as JavaScript regardless of the info string specified (and even if left unspecified). The following line executes the code that does this.

node/doc/template.html

Line 56 in 94e5b5c

<script>highlight(undefined, undefined, 'pre');</script>

This behavior can be observed in the C++ code blocks in the published API reference documents. The following line is the reason for this — the language has been hard-coded.

node/doc/api_assets/sh_main.js

Line 542 in 94e5b5c

sh_highlightElement(element, sh_languages["javascript"]);

---

• I would like to work on this issue and submit a pull request.

^ I'm currently on summer vacation, so I would have the time to work on this.

/cc @Trott

[Trott]

Yes, please fix this! 😀

[DerekNonGeneric]

@Trott, it is my impression that this would be an excellent opportunity to switch to highlight.js for a few reasons:

1. SHJS hasn't been updated in 6 years
2. SHJS is GPL v3 licensed
3. SHJS doesn't understand modern language syntax
4. highlight.js is currently well-maintained (and popular)
5. highlight.js is BSD licensed
6. highlight.js is able to highlight the modern syntax of several languages
7. we'd have syntax highlighting on par w/ the Markdown docs rendered on github.com

I think there was a reason why @zeke mentioned it in passing — it's the route to go nowadays. If GitHub's syntax highlighting library (Prettylights) were OSS, we'd ideally use that, but that doesn't seem to be one of our options. I can give it a day or two before proceeding in case others want to shop around and propose a superior frontend syntax highlighting library, but this seems like the best bet as far as I can tell.

/cc @nodejs/documentation

[zeke]

I think there was a reason why @zeke mentioned it in passing — it's the route to go nowadays

☝️ Yep that is why I mentioned it.

[wooorm]

Hi folks! As this discussion mentions ideally using PrettyLights by GH, I wanted to drop a suggestion for a project which I made that does exactly that: https://github.com/wooorm/starry-night. HLJS is much lighter, but if y’all are noticing problems, starry-night might be a good choice!