Fenced Code Blocks with classes and ID's do not work

[lakhman]

Hi,

https://michelf.ca/projects/php-markdown/extra/#fenced-code-blocks

I noticed this small issue with fenced code blocks:

The following:

~~~~~~~~~~~~~~~~~~~~~~~~~~~~ {.html #example-1}
<p>paragraph <b>emphasis</b>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Should parse into:

<pre><code id="example-1" class="html">&lt;p&gt;paragraph &lt;b&gt;emphasis&lt;/b&gt;
</code></pre>

but actually gives:

<p><del>~</del><del>~</del><del>~</del><del>~</del><del>~</del>~~~ {.html #example-1}</p>
<p>paragraph <b>emphasis</b>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~</p>

This would be incredibly useful for syntax highlighting amongst other stuff.

Thanks!

[jerry1970]

Another difference between Markdown Extra and Parsedown Extra when you have a fenced block with just "someclass" following it (I can't finish the example since GFM doesn't like nested blocks; not sure how Lakhman did it!):

   ~~~ someclass

ME:

<pre><code class="someclass">code</code></pre>

PE:

<pre><code class="language-someclass">code</code></pre>

I hope there will be a difference between a fenced block with a language type (class="language-someclass") and an extra class (class="someclass") so I could even have class="language-html best-example".

[tomturton]

+1

[willstocks]

@erusev - do you know if this is/will be fixed? I recently started using OctoberCMS and realised Parsedown + Parsedown Extra are included by default, but noticed that adding a class/ID to a code block doesn't work when writing either markdown page content or a blog post using rainlab's blog plugin (please see https://github.com/rainlab/blog-plugin/issues/457)

[erusev]

@aidantwoods do you have any thoughts on this

[aidantwoods]

I don't foresee any issues with supporting this for fenced code blocks, I'll have a go later today. As @lakhman points out, this is something that should work per the extra spec, so it should probably be supported here :)

[willstocks]

Thanks @aidantwoods 😁 Looking forward to it!

[taufik-nurrohman]

@lakhman Read this section to add custom classes without language- prefix in Markdown Extra using my extension. Currently compatible for Parsedown Extra 0.7.0.

Update: #133

[willstocks]

@aidantwoods / @erusev - is @tovic's solution a viable solution that will be backed into PE or will you guys have an alternate/formal solution for this?

I only ask because obviously Parsedown + Parsedown Extra are bundled into October and it'd be great to not have to fudge something together 😁

[willstocks]

Any luck with this one @aidantwoods?

[willstocks]

Hey @aidantwoods / @erusev Don't suppose you happen to have any update on this one? Or maybe is it worth @tovic putting in a PR for this functionality? Would be nice to see this "native" in October/in other places PE is used :)

[taufik-nurrohman]

@willstocks I could, but looking at the philosophy of Parsedown, they seem to prefer simplicity. That is to simply process Markdown input to HTML according to the CommonMark specs without providing many complicated options. So, it would still be better if the advanced configuration is available as a separate plugin.

[willstocks]

@tovic whilst I agree with you that they like to keep things simple, Parsedown Extra (which is, in itself, an extension of Parsedown) adds support for Markdown Extra, which includes this functionality (https://michelf.ca/projects/php-markdown/extra/#fenced-code-blocks) for code blocks therefore in theory this should be supported as standard within PE?

Markdown Extra example (from link above):

You can specify a class name that will apply to a code block. This is useful if you want to style differently code blocks depending on the language. Or you could also use it to tell a syntax highlighter what syntax to use.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~ .html
<p>paragraph <b>emphasis</b>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~

The class name is placed at the end of the first fence. It can be preceded by a dot, but this is not a requirement. You can also use a special attribute block:

~~~~~~~~~~~~~~~~~~~~~~~~~~~~ {.html #example-1}
<p>paragraph <b>emphasis</b>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~

[taufik-nurrohman]

From this commit, I can see that @aidantwoods is deliberately limiting the class names that are allowed in the code block attribute to just one class name. Somehow, maybe to prevent XSS.

[willstocks]

@aidantwoods is there a reason for this restriction? Would you be open to @tovic submitting a PR (if he's happy to that is!!!) considering he has already extended this functionality externally or would you prefer to handle extending class/id's to code blocks within existing PE contributors?