Markdown-it-py plugin to add language-none class code fences without …

…a language. Always load Prismjs styles. Consequent changes in JS flow and tests.

funnel/assets/js/utils/prism.js

@@ -15,7 +15,8 @@ const PrismEmbed = {
     ];
     let asset = 0;
     const loadPrismStyle = () => {
-      $('head').append($(`<link href="${CDN_CSS}" rel="stylesheet"></link>`));
+      if (!$(`link[href*="${CDN_CSS}"]`).length)
+        $('head').append($(`<link href="${CDN_CSS}" rel="stylesheet"></link>`));
     };
     const loadPrismScript = () => {
       $.ajax({
@@ -41,8 +42,8 @@ const PrismEmbed = {
         }
       });
     };
+    loadPrismStyle();
     if (!window.Prism) {
-      loadPrismStyle();
       loadPrismScript();
     } else this.activatePrism();
   },

funnel/utils/markdown/base.py

@@ -27,6 +27,7 @@
 from .mdit_plugins import (  # toc_plugin,
     del_plugin,
     embeds_plugin,
+    fence_extend_plugin,
     ins_plugin,
     mark_plugin,
     sub_plugin,
@@ -170,11 +171,14 @@ def render(self, text: Optional[str]) -> Optional[Markup]:
 MarkdownPlugin('markmap', embeds_plugin, {'name': 'markmap'})
 MarkdownPlugin('vega-lite', embeds_plugin, {'name': 'vega-lite'})
 MarkdownPlugin('mermaid', embeds_plugin, {'name': 'mermaid'})
+MarkdownPlugin('fence_ext', fence_extend_plugin)
 # MarkdownPlugin('toc', toc_plugin)
 
 # --- Markdown configurations ----------------------------------------------------------
 
-MarkdownConfig(name='basic', options_update={'html': False, 'breaks': True})
+MarkdownConfig(
+    name='basic', options_update={'html': False, 'breaks': True}, plugins={'fence_ext'}
+)
 MarkdownConfig(
     name='document',
     preset='gfm-like',
@@ -196,6 +200,7 @@ def render(self, text: Optional[str]) -> Optional[Markup]:
         'markmap',
         'vega-lite',
         'mermaid',
+        'fence_ext',
         # 'toc',
     },
     enable_rules={'smartquotes'},

funnel/utils/markdown/mdit_plugins/__init__.py

@@ -3,6 +3,7 @@
 
 from .del_tag import *
 from .embeds import *
+from .fence_ext import *
 from .ins_tag import *
 from .mark_tag import *
 from .sub_tag import *

funnel/utils/markdown/mdit_plugins/fence_ext.py

@@ -0,0 +1,13 @@
+"""Markdown-it-py plugin to add language-none class to code fence tokens."""
+
+from markdown_it import MarkdownIt
+from markdown_it.renderer import RendererHTML
+
+
+def fence_extend_plugin(md: MarkdownIt, **opts) -> None:
+    def fence(self, tokens, idx, options, env):
+        output = RendererHTML.fence(self, tokens, idx, options, env)
+        output = output.replace('<pre><code>', '<pre><code class="language-none">')
+        return output
+
+    md.add_render_rule('fence', fence)

tests/unit/utils/markdown/data/code.toml

@@ -72,7 +72,7 @@ line 2 of code
 line 3 of code
 </code></pre>
 <h3>Block code &quot;fences&quot;</h3>
-<pre><code>Sample text here...
+<pre><code class="language-none">Sample text here...
 It is a sample text that has multiple lines
 </code></pre>
 <h3>Syntax highlighting</h3>
@@ -120,7 +120,7 @@ line 2 of code
 line 3 of code
 </code></pre>
 <h3 id="h:block-code-fences">Block code “fences” <a class="header-anchor" href="#h:block-code-fences">¶</a></h3>
-<pre><code>Sample text here...
+<pre><code class="language-none">Sample text here...
 It is a sample text that has multiple lines
 </code></pre>
 <h3 id="h:syntax-highlighting">Syntax highlighting <a class="header-anchor" href="#h:syntax-highlighting">¶</a></h3>