I created a Showdown extension which wraps content in a div structure with an icon as follows.
showdown.extension('json-value', function()
{
'use strict';
return [
{
type: 'lang',
regex: /^(?:[ ]*)<>(?!>>)(?:[ ]*)(.+?)$/gm,
replace: function(match, text)
{
return '<div class="json-value"><div>@icon-code</div><div>' + text + '</div></div>';
}
},
{
type: 'lang',
regex: /^(?:[ ]*)<>>>(?:[ ]*)([^]+?)
>>>/gm,
replace: function(match, text)
{
return '<div class="json-value"><div>@icon-code</div><div>' + text + '</div></div>';
}
}
];
}
);
This would operate on markdown text such as this:
<> This is a **JSON value** test!
<>>> This is another JSON value test!
| Value | Meaning
| :---- | :------
| `VI` | VFR/IFR - visual and instrumentation flight rules
| `V` | VFR - visual flight rules
| `I` | IFR - instrumentation flight rules
>>>
The @icon-code
is markdown formatting for another extension and it correctly creates an icon.
The problem is if I add HTML after the matched text it causes any markdown in that text to not be parsed. So in the above example the bold text and the table are not converted to HTML.
However, if I change the return lines to either:
return '<div class="json-value"><div>@icon-code</div><div>' + text;
Or:
return '<div class="json-value"><div>@icon-code</div><div></div></div>' + text + '';
Then the markdown is parsed correctly. Can anyone suggest how to wrap the matched text and still have complete parsing? Thank you.
question from:https://stackoverflow.com/questions/65661022/markdown-wrapped-inside-html-by-showdown-extension-not-parsed