Markdown code blocks marked as csharp missing defined syntax highlighting

[TheBoxyBear]

Operating System: (Windows or Linux or MacOS)
Windows 11

DocFX Version Used:
docfx.console NuGet 2.59.4

Template used: (default or statictoc or contain custom template)
SingulinkFX

Steps to Reproduce:

1. Create a .NET 6 console project with the docfx.console v2.59.4 NuGet Package
2. Create a markdown with a multi-line C# code block
3. Build and run the site locally

The SingulinkFX provides full syntax highlithing in config.css. Inspecting the resulting HTML, code blocks generated from assembly have their code split into spans with the respective colors applied. Defining a code block such as

Console.WriteLine("Hello World");

results in <code class="lang-csharp hljs"> tags with the code left as plain text, rather than being parsed and split into spans. The same happens if c# is used instead of cs with the code class being lang-c# hljs Actual example of problematic markdown

Expected Behavior:
Code in markdown code blocks are parsed and converted into spans with styles applied such as here https://www.singulink.com/Docs/Singulink.IO.FileSystem/articles/guides/getting-started.html

Actual Behavior:
Cotents of the code blocks are left are plain text between the opening and closing <code> tags, only applying styles for keywords like "new".

[paulushub]

@TheBoxyBear I am not sure I understand your issue clearly, but below is a screenshot example of a DocFX output. Is this different from yours?

[TheBoxyBear]

From an article

Auto-generated for api

In the article, the HTML for the code block is <code class="lang-csharp hljs">Sont song = Song.FromFile(path); </code>, unlike the code tags in the api pages and https://www.singulink.com/Docs/Singulink.IO.FileSystem/articles/guides/getting-started.html where the code is seprated into tokens with colors applied to each one.

[TheBoxyBear]

[TheBoxyBear]

Not entirely sure if this is a DocFx or template issue. I took a look through the template source files and could not find anything related to code blocks except the style definition for the block and colors for the different types of tokens.

[paulushub]

The syntax highlighting support is handled by highlight.js, which dynamically generate the coloring such as the <span class="hljs-keyword">public</span>. If this is what you are referring to, it is a JavaScript generated code so you will not see it in the output HTML file.

If your actual desire is color scheme (try some examples by clicking the style: on the sample demo code at highlight.js), then you will have to customize the template with your desired scheme.

[TheBoxyBear]

Indeed, they are not present in the generated HTML but do when looking at the final HTML from DevTools. There is still a discrepency with how code blocks are generated between articles and api documentation. There are no javascript errors related to highlight.js when articles are loaded.

[TheBoxyBear]

Seems that now spans do get generated but only for the more complex code. It could be that the blocks I was looking at had no signoficant tokens to be highlighted.

[paulushub]

There is still a discrepency with how code blocks are generated between articles and api documentation.

For the codes in the screenshot I posted, there is no difference in the outputs.

It could be that the blocks I was looking at had no signoficant tokens to be highlighted.

The level of highlight may also depend on the color scheme, the default may not be that colorful (just click the style: I mentioned earlier until you get style:default and compare to others). So try the scheme that meets your needs and use it in your custom template.

[TheBoxyBear]

None issue, highlight.js applies no syntax highlighting to things like type references in bodies, methods calls, property references and variable references. This can cause certain code blocks appear to not have syntax highlighting while in reality, there is nothing to highlight.