prism and mermaid conflict

[oemunoz]

I was some time trying to make prism and mermaid work,

graph LR
    prism-- conflict ---mermaid

By default, parsedown adds "language" to the div class, this causes prism to process the code, and therefore mermaid does not work correctly.

At the end the workaround was to add the following code to the "blockFencedCode" function: Parsedown.php

if ($infostring !== '')
        {
                if ($infostring == 'mermaid')
                {
                    $Element['attributes'] = array('class' => $infostring);
                }
                else
                {
                    $Element['attributes'] = array('class' => "language-$infostring");
                }
        }

Is posible to add these lines, the advantage is that mermaid works out of the box.

[aidantwoods]

Parsedown shouldn't be adding any classes to divs? Code in the blockFencedCode that you've mentioned should be outputting things like:

<pre><code class="language-php">foo
</code></pre>

For this custom behaviour your best option is an implementing it in an extension (as you've essentially already done by modifying the code). Unfortunately I don't think we can really reasonably add edge cases into Parsedown for interoperability with custom software that isn't necessarily used by everyone (else we'd potentially end up with 1000s of edge cases like this).

The current behaviour matches the suggested implementation from the CommonMark spec, and while no specific treatment is mandated for the infostring by the spec, I think there should be a compelling reason to diverge. I don't really think we should set a precedent for making this kind of interoperability change, since it wouldn't be possible to accommodate for everything.

[gaffling]

I made this change to make prism work with line-numbers, is there any nicer way?

$Element['attributes'] = array('class' => "language-$language line-numbers");

[taufik-nurrohman]

My extension allows more class attributes to be added to the code block. You can even set your own language prefix here.