dempe / anki-easy-code-tags

Convert backticks to HTML <code> tags in the Anki editor
0 stars 0 forks source link

Triple ticks produce extra <br> in the HTML and preview on a single line #1

Open kevinpolisano opened 7 months ago

kevinpolisano commented 7 months ago

Thanks for this useful add-on!

Using Prism, this how the outputs looks like:

\```python
import sys, os, re, shelve

# Utilities

class No_detail:
    strerror = ""

no_detail = No_detail()
\```

gives this HTML:

<pre><code class="language-python">import sys, os, re, shelve<br><br># Utilities<br><br>class No_detail:<br>&nbsp;&nbsp;&nbsp; strerror = ""<br><br>no_detail = No_detail()<br></code></pre>

and the preview is on a single line:

Capture d’écran 2024-04-04 à 08 49 13

kevinpolisano commented 7 months ago

Ok this is not your fault, it is due to Prism, you have to add this code to Prism.js:

Prism.hooks.add('before-highlight', function (env)
{
  env.code = env.element.innerText;
});

Explanations are given here and here

Now it works:

Capture d’écran 2024-04-04 à 21 02 49

dempe commented 4 months ago

This is actually a valid issue, and thank you for reporting it!

Looks like Prism saved you here, but the underlying issue is that somehow \n is being converted to <br> ... in the Anki editor. In other words, I cannot replicate the issue with my unit tests. Based on the comments on my addon, this has been happening since early January this year.

I will investigate this today.