Why is showdown messing with my <pre><code> ?

[ghazpar]

Can anyone explain the following unexpected behavior using a default converter:

converter = new showdown.Converter();
a = '<pre><code><strong>x = 0</strong></code></pre>';
b = '<p>Yo!</p><pre><code><strong>x = 0</strong></code></pre>';

console.log(converter.makeHtml(a));
console.log(converter.makeHtml(b));

The first output is fine:

<pre><code><strong>x = 0</strong></code></pre>

While the second is unexpected:

<p>Yo!</p>
<pre><code>&lt;strong&gt;x = 0&lt;/strong&gt;</code></pre>

Why is showndown messing with the inside of my <pre><code> in the second case, but not in the first???

And why is it messing with the inside of any tag in the first place?

[SyntaxRules]

I could not reproduce on the showdown js demo site. What version of ShowdownJs are you using?

[ghazpar]

I am using 1.9.1.

The output that I have shown is from the Chrome console. After rendering, the string <pre><code>&lt;strong&gt;x = 0&lt;/strong&gt;</code></pre> will be shown as <pre><code><strong>x = 0</strong></code></pre> as can be seen in the live editor, but the behavior of showdown is still strange. Why is the output if this specific b string different from the output of the a string when a paragraph is prefixed?

The conversion of < into < and > into > was causing me a problem with prism, and this is the smallest example I could find to reproduce my problem.

[aakodadi]

I think that's normal. What's inside a code tag is supposed to be shown as is in the browser. That's why < and > are replaced by their entity counterparts. Because otherwise, the browser will interpret process them as tags.

HTML Entities

Some characters are reserved in HTML.

If you use the less than (<) or greater than (>) signs in your text, the browser might mix them with tags.

Character entities are used to display reserved characters in HTML.

Cf. w3schools.com